Html.BeginForm不嵌套形式工作

Question

視圖1

@model WebApplication2.Models.TestViewModel 

@using (Html.BeginForm("Test", "Home")) 
{ 
    <div>Upper form</div> 
    @Html.EditorForModel() 
} 

在EditorTemplates我有編輯對這一觀點

@model WebApplication2.Models.TestViewModel 

@using (Html.BeginForm("Test2", "Home")) 
{ 
    <h2>TestViewModel</h2> 
} 

實際的結果是

<form action="/Home/Test" method="post">  
    <div>Upper form</div> 
    <div class="editor-label"><label for="Age">Age</label></div> 
    <div class="editor-field"><input class="text-box single-line" data-val="true" data-val-number="The field Age must be a number." data-val-required="The Age field is required." id="Age" name="Age" type="number" value="0"> <span class="field-validation-valid" data-valmsg-for="Age" data-valmsg-replace="true"></span></div> 
    <div class="editor-label"><label for="Name">Name</label></div> 
    <div class="editor-field"><input class="text-box single-line" id="Name" name="Name" type="text" value=""> <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span></div> 
</form> 

但希望結果應該是

<form action="/Home/Test" method="post">  
    <div>Upper form</div> 
    <form action="/Home/Test2" method="post"> 
     <div class="editor-label"><label for="Age">Age</label></div> 
     <div class="editor-field"><input class="text-box single-line" data-val="true" data-val-number="The field Age must be a number." data-val-required="The Age field is required." id="Age" name="Age" type="number" value="0"> <span class="field-validation-valid" data-valmsg-for="Age" data-valmsg-replace="true"></span></div> 
     <div class="editor-label"><label for="Name">Name</label></div> 
     <div class="editor-field"><input class="text-box single-line" id="Name" name="Name" type="text" value=""> <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span></div> 
    <form> 
</form> 

所以我的問題是如何正確嵌套第二個BeginForm？

Answer 1

正如評論中提到的其他內容，嵌套表單不是一個好主意。

你應該做的是，保持你的外部視圖的窗體標籤原樣。對於你的模型，使用沒有表單標籤的普通html表單元素，並使用ajax從你的java腳本將數據發佈到服務器，一旦你接收到數據，你應該能夠使用jQuery訪問DOM元素並根據需要更新值。

類似這樣的（下面的代碼不會與你提供的標記一起工作，這只是給你一個想法如何處理它一般）;

$(function(){ 

    $(document).on("click","#SomeBtnOnModelDialog",function(e){ 
    //Some submit button on model dialog was clicked 
    e.preventDefault(); 

    //Read the data from model dialog elements using jquery 
    // and build an object to send to action method 

    var dummyDataYouWantToSend = { name : "Read it using jquery",age:12}; 
    $.post("@Url.Action("SomeActionMethod","YourController")", dummyDataYouWantToSend , 
                 function (res){ 

     //Got some response. 
     //Now update some DOM elemets from the JSON response came back? 
    // $("#SomeFormElementId").val(res.SomePropertyName);  
    }); 

    }); 

});