在MVC 3我有一个视图与3部分视图.我如何得到第三部分视图显示在同一页面上

本文关键字：视图 三部 一页 显示 有一个 MVC 3部 何得 | 更新日期: 2023-09-27 18:05:43

我有一个3部分视图的视图。第一个部分视图有一个下拉列表。您从下拉菜单中选择一些内容，然后第二个部分视图将在同一页面的右侧加载。

然后我有一个搜索表单(html.BeginForm)在我的第二个部分视图，当我提交的形式，我想打开第二部分下的第三部分视图。

第三个部分视图有一个kendo ui网格，它接受一个模型。

现在的问题是第三部分视图在不同的页面上呈现。

视图:

 <section>
      <div id="searchpanel">
          @html.Partial("_1stPartial")
          <div id="2ndPartialDiv"></div>
          <div id="3rdPartialDiv"></div>
      </div>
 </section>
部分View2: 

<section>
  <div id="searchblock">
     <table>
       <tr>
         <td>
            @using (Ajax.BeginForm("Search", "ControllerName", new AjaxOptions {  updateTargetId = "3rdPartialDiv"}))
          <fieldset>
          <ol>
            <li></li>
            <li>
             <input type="submit" value="Search" id="btnSearch"/>
            </li>
          </ol>
          </fieldset>
        </td>
       </tr>
      </table>
  </div>
</section>

控制器:

public ActionResult Search(model)
{
   //fill searchresults
   return PartialView("_3rdPartial", searchresults);
}

在MVC 3我有一个视图与3部分视图.我如何得到第三部分视图显示在同一页面上

Html。BeginForm将执行一个完整的页面发布。我相信你要找的是Ajax.BeginForm.

http://msdn.microsoft.com/en-us/library/system.web.mvc.ajax.ajaxextensions.beginform (v = vs.118) . aspx

的例子:

    @using (Ajax.BeginForm("TheActionResultYouWantToInvokeThatWillReturnTheThirdView", "YourController", null, new AjaxOptions { UpdateTargetId = "theIdOfTheDivForTheThirdView", OnSuccess = "doFunctionIfYouNeedTo", OnFailure = "ShowPopUpErrorIfYouWant" }))
     {
     }

邮编添加编辑:

此标记无效，这可能是UpdateTargetId找不到Div的原因。

<section>
      <div id="searchpanel">
          @html.Partial("_1stPartial")
          <div id="2ndPartialDiv"></div>
          <div id="3rdPartialDiv"></div>
      </div>
 </section>

我从你的问题中理解的是，你正在从第一个PartialView进行提交，如果这是成功的，你将显示第二个。这个也一样。如果一个成功的POST是由第二个PartialView制成的，你想要显示第三个。

为什么不从客户端来处理Ajax呢?

 $.ajax ({
   type:'POST'
   data: {},
   success: function(response){
       $('.specific_div_container_for_previous_partial').hide();
       $('.specific_div_container_for_partial').html(response.Html);
       $('.specific_div_container_for_partial').show();
   },
   error: function(){
       // whatever
   }
 });

在服务器端，您将返回呈现的html和PartialView。要在variable中呈现PartialView并将其作为json对象发送到客户端，请查看THIS

更新 -如何在jquery中序列化表单

请按THIS

相关文章：