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

Html 如何在不同的选项卡面板中发布到两个单独的表单,html,asp.net-mvc,razor,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" })) {

我的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>

@使用(Html.BeginForm(新的{Action=“Action X”,id=“publishingForm”})){
@Html.AntiForgeryToken()
@Html.ValidationSummary()
这里是局部视图 }
正如您所看到的,选项卡div被包装在一个表单中(发布到控制器X)

问题在于,文件上载的部分视图还包括一个表单,该表单应该发布到处理程序。但当我在选项卡3中启动文件上传时,它正试图将文件上传到原始表单的控制器X

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


底线是我试图分别发布到不同选项卡面板中包含的两个不同表单

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

   @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.
@使用(Ajax.BeginForm(新的AjaxOptions{UpdateTargetId=“updateDiv”}))
{
}
@使用(Ajax.BeginForm(新的AjaxOptions{UpdateTargetId=“updateDiv2”}))
{
}
并在代码需要时为每个提交按钮调用.click()。

BeginForm()
移动到选项卡中。每个选项卡都有一个表单,其中包含要发布到的不同操作。每个表单都可以是一个局部视图页面,具有自己的模型以保持其强类型。另一种方法是使用AJAX指定一个操作来代替传统的表单提交。我需要一个表单来跨越2个选项卡。当我跨越选项卡1和2时,只有第一个选项卡是可选择的,而我无法选择其他选项卡是否使用引导选项卡?了解这一点将有助于其他人复制您的问题。使用我在问题中发布的示例,我需要发布位于不同div中的选项卡1和2的值。对于我的场景,什么是最好的解决方案