如何在不同的选项卡面板中发布到2个单独的表单

时间:2013-09-09 01:16:42

标签: html asp.net-mvc razor

我的ASP.NET MVC应用程序包含一个Razor视图,其中包含3个带有大量字段的选项卡。

  • 标签1-2有一堆字段
  • 标签3应该有一个文件上传部分,应该从局部视图渲染。

这是结构:

    <body>
        <div class="container well" >
            @using (Html.BeginForm(new { Action = "action X",id="publishingForm" })) {
                @Html.AntiForgeryToken()
    @Html.ValidationSummary()

                <div class="form-horizontal">    


                    <div class="tabbable"> 
                        <ul class="nav nav-tabs">
                            <li class="active"><a href="#requiredtab" data-toggle="tab"><span><strong>Step 1:</strong></span> Enter required fields</a></li>
                            <li><a href="#optionaltab" data-toggle="tab"><strong>Step 2:</strong> Enter optional fields</a></li>
                            <li><a href="#uplaodtab" data-toggle="tab"><strong>Step 3:</strong> Upload your video</a></li>
                        </ul>

                        <div class="tab-content">

                            <div class="tab-pane active" id="requiredtab">

                            </div>

                            <div class="tab-pane" id="optionaltab">         


                            </div>

                            <div class="tab-pane" id="uplaodtab">
partial view here

                            </div>

                        </div>

                    </div>

                </div>
                }
        </div>
        </body>
</html>

正如您所见,标签Div包含在一个表单中(发布到Controller X)。

问题是文件上传的部分视图还包括一个应该发布到处理程序的表单。但是当我在Tab 3中启动文件上传时,它会尝试将原始表单发布到Controller X.

如何构建我的视图以使表单中的字段包含在选项卡1和表1中。 2发布到控制器X和表3中的表单发布到其正确的处理程序?

底线是我试图分别发布到不同标签面板中包含的两种不同形式

1 个答案:

答案 0 :(得分:0)

我建议您使用Ajax Forms包装两个表单,并且可以异步提交它们

   @using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "updateDiv" }))
   {
      <input type="submit" id="submitForm1" value="OK" />
   }

   <div id="updateDiv"></div>


    @using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "updateDiv2" }))
   {
     <input type="submit" id="submitForm2" value="OK" />
    }

  <div id="updateDiv2"></div>

 and call the  .click() for each submit button whenever your code needs to.
相关问题