MVC mehrere Formulare auf Einzelansicht funktioniert nicht

Question

Ich habe 2 Formulare auf einer einzigen Rasierer-Ansicht, die in separaten Dialogfeldern öffnen. Die Formulare werden mit Jquery Post eingereicht ..

Erste Form funktioniert perfekt, aber die zweite Form ist nicht überhaupt erkannt und wenn ich versuche, um die Daten zu serializr es gibt einen leeren String.

-Code unten:

@using (Html.BeginForm("SaveElectricReading", "Store", FormMethod.Post, new { id = "frmSaveElectricReading" })) 
{ 
    <div id="electricDialog" style="display: none;" title="Electric Readings"> 
     <p> 
      Please ensure the electric readings have been entered! 
     </p> 
     <table width="100%"> 
      <tr> 
       <th> 
        Serial: 
       </th> 
      </tr> 
      <tr> 
       <td> 
        <input type="text" name="Serial" /> 
       </td> 
      </tr> 
      <tr> 
       <th> 
        Reading: 
       </th> 
      </tr> 
      <tr> 
       <td> 
        <input type="text" name="Reading" /> 
       </td> 
      </tr> 
      <tr> 
       <th> 
        Comment: 
       </th> 
      </tr> 
      <tr> 
       <td> 
        <div class="textwrapper"> 
         <textarea rows="5" cols="10" name="Comment"></textarea> 
        </div> 
       </td> 
      </tr> 
     </table> 
    </div> 
} 

@using (Html.BeginForm("SaveWaterReading", "Store", FormMethod.Post, new { id = "myform" })) 
{ 
    <div id="waterDialog" style="display: none;" title="Water Readings"> 
     <p> 
      Please ensure the water readings have been entered! 
     </p> 
     <table width="100%"> 
      <tr> 
       <th> 
        Serial: 
       </th> 
      </tr> 
      <tr> 
       <td> 
        <input type="text" name="WaterSerial" /> 
       </td> 
      </tr> 
      <tr> 
       <th> 
        Reading: 
       </th> 
      </tr> 
      <tr> 
       <td> 
        <input type="text" name="WaterReadingsdfsdf" /> 
       </td> 
      </tr> 
      <tr> 
       <th> 
        Comment: 
       </th> 
      </tr> 
      <tr> 
       <td> 
        <div class="textwrapper"> 
         <textarea rows="5" cols="10" name="WaterComment"></textarea> 
        </div> 
       </td> 
      </tr> 
     </table> 
    </div> 
} 

function showWaterDialog() { 
    var $dialog = $('#waterDialog').dialog({ 
     autoOpen: false, 
     modal: true, 
     width: 400, 
     height: 400, 
     buttons: { 
      Submit: function() { 
       //    $('#frmCreateStore').submit(); 
       var data = $('#frmSaveWaterReading'); 

       $.post("/Store/SaveWaterReading", 
        $("#frmSaveWaterReading").serialize(), 
        function() { 
         $("#waterDialog").dialog("close"); 
        }); 
       //$(this).dialog("close"); 
      }, 
      Cancel: function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

    $dialog.dialog('open'); 
} 

Answer 1

In der jQuery-Funktion den Dialog mit der Form darin zu zeigen, brauchte ich, dass Dialog Inhalt in die zweite Form auf der Seite hinzufügen wie folgt:

$ ("#waterDialog"). parent(). appendTo ($ ("form"). eq (1) [0]);