MVC複数のフォームが1つのビューで動作しない

Question

1つのカミソリビューに2つのフォームがあり、別々のダイアログボックスで開きます。フォームはjquery postを使用して提出されます。

最初のフォームは完全には動作しますが、2番目のフォームは全く認識されません。データをserializrしようとすると、空の文字列が返されます。以下

コード：jQueryの機能で

@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

それにフォームとの対話を示すために、私は次のようにページの2つ目のフォームにそのダイアログのコンテンツを追加するために必要な：

$ （ "＃waterDialog"）。parent（）。appendTo（$（ "form"）。eq（1）[0]）;