2 different structures with select field

Question

I need 2 forms on the same page and I am trying at the end to create a select field so I can choose between one or the other, I am trying here several ways without success ! Please help, please follow:

<div class="module-body" id="div1">
    <section class="docs">
        <form method="post" action="" class="form-horizontal row-fluid">
            <input type="hidden" name="codigoPlanoEscolhido" value="<?=$codigoPlano?>" />
            <input type="hidden" name="nomePlanoEscolhido" value="<?=$nomePlano?>" />
            <input type="hidden" name="tipoPlanoEscolhido" value="<?=$tipoPlano?>" />


   <input type="text" name="clienteEmail" value="<?php  $telefone = '55' . $cliente->telefones[1]->ddd .       $cliente->telefones[2]->numero;

    echo '(22)'.("******"), substr($telefone, -3).''

      ;?>" class="span3" disabled />
        <br>

            <button name="confirmarPedido" class="btn btn-primary btn-lg">Confirmar Minha Solicitação Por SMS</button>
        </form>

<div id="div2" class="module-body" style="display:none">
            <form method="post" action="upgrade-3">
                <input type="hidden" name="codigoPlanoEscolhido" value="<?=$codigoPlano?>" />
                <input type="hidden" name="nomePlanoEscolhido" value="<?=$nomePlano?>" />
                <input type="hidden" name="tipoPlanoEscolhido" value="<?=$tipoPlano?>" />
                <button name="solicitarUpgrade" class="btn btn-primary btn-lg">Confirmar solicitação por Email</button>
            </form>

            <script>
                function oWhichSubmit(thisSubmit) {
                    var oWhich = thisSubmit.value;
                    if (document.getElementById(oWhich)) {
                        document.getElementById(oWhich).click();
                    }
                }
            </script>

            <select onchange="oWhichSubmit(this)" onkeypress="oWhichSubmit(this)">
                <option value="confirmarPedido"></option>
                <option value="confirmarPedido">Submit1</option>
                <option value="solicitarUpgrade">Submit2</option>
            </select>
            <input type="submit" name="confirmarPedido" id="upgrade2" value="confirmarPedido" />

     <?=getClienteEmail($cliente)?>"  class="span3" disabled/><br>
 <button name="solicitarUpgrade"  class="btn btn-primary                        tn-lg">Confirmar solicitação pelo Email</button>
                </form>
          "  class="span3" disabled/>
           <input type="submit" name="solicitarUpgrade"        id="upgrade3" value="solicitarUpgrade" />
            </form>

 <select id="mySelect">
 <option value="div1">div1</option>
<option value="div2">div2</option>
</select>


 <script>

document.getElementById("mySelect").addEventListener("change",       myFunction);
function myFunction() {
   var x = document.getElementById("mySelect").value;
   if(x=="div1"){
    document.getElementById("div1").style.display="block"; 
  document.getElementById("div2").style.display="none"; 
    }else if(x=="div2"){
    document.getElementById("div2").style.display="block"; 
  document.getElementById("div1").style.display="none"; 
    }
}
 </script>

I need you to select at the end me the option to choose between one and the other and do Submit

Answer 1

Put each form inside different Ivs with None display:

<select id="mySelect">
  <option value="div1">div1</option>
  <option value="div2">div2</option>
</select>
<div id="div1" style="background:red;height:100px;width:100px;">
  <form></form>
</div>
<div id="div2" style="display:none;background:blue;height:100px;width:100px;">
  <form></form>
</div>

Javascript:

document.getElementById("mySelect").addEventListener("change", myFunction);
function myFunction() {
    var x = document.getElementById("mySelect").value;
    if(x=="div1"){
        document.getElementById("div1").style.display="block"; 
      document.getElementById("div2").style.display="none"; 
    }else if(x=="div2"){
        document.getElementById("div2").style.display="block"; 
      document.getElementById("div1").style.display="none"; 
    }
}

I made that example: https://jsfiddle.net/k8ebn4ja/