Question

我在主视图

上有三个部分视图

在第一个局部视图中我有搜索功能，当用户点击搜索时我想将结果刷新到第三个局部视图。

控制器：

public ActionResult Search()
{  
         virtualmodel vm = new virtualmodel(); 
      return PartialView(svm);

} 

[HttpPost]
public ActionResult Search(ViewModel svm)
{  
         // Query to retrive the result 
      // I am not sure what to return from here. Link to another action    or just return back to same same partial 

} 

public ActionResult AnotherPartialPartial()
{
}

在主视图中

 @{Html.RenderAction("Search", "Searchc");
  }

怎么做？我需要ajax吗？

Answer 1

使用ajax，您可以调用控制器操作并将其返回给特定的div。

清空div：

<div class="row" id="div3">

</div>

Ajax在空div中显示html：

function performSearch(searchCriteria) {
   //get information to pass to controller
   var searchInformation = JSON.stringify(**your search information**);

            $.ajax({
                url: '@Url.Action("Search", "ControllerName")',//controller name and action 
                type: 'POST',
                data: { 'svm': searchInformation } //information for search
            })
            .success(function (result) {
                $('#div3').html(result); //write returned partial view to empty div
            })
            .error(function (xhr, status) {
                alert(status);
            })
        }

Answer 2

jQuery会帮助你！尝试处理提交按钮onclick事件，如下所示：

$("#yourButtonId").click(function()
{
   $.ajax({
      type: "POST",
                url: "/yourUrl", //in asp.net mvc using ActionResult
                data: data,
                dataType: 'html',
                success: function (result) {
              //Your result is here
              $("#yourContainerId").html(result);
      }
   });
});

Answer 3

您可以使用ajax。

首先，在视图中将html.beginform更改为ajax.beginform，并将div id添加到要更改内容的 UpdateTargetId 中。使用ajax.beginform更新第一个partial后，您可以使用ajax.beginform＆lt; b＆＃34; OnSuccess＆＃34; 函数更新其他部分视图。您必须添加更新功能：

@using (Ajax.BeginForm("YourAction", "YourController", 
        new { /*your objects*/ }, new AjaxOptions { HttpMethod = "POST", InsertionMode = InsertionMode.Replace, 
        UpdateTargetId = "ChangeThisPart", OnSuccess = "OnSuccessMethod" }))
        {
           /*your code*/
        }

<script>
   function OnSuccessMethod() {
      $("#YouWantToChangeSecondDivID").load('/YourController/YourAction2');
      $("#YouWantToChangeThirdDivID").load('/YourController/YourAction3');
   };
</script>

然后在您的控制器中，返回部分视图以刷新您在UpdateTargetId值中输入ID的视图部分：

public ActionResult YourControllerName(YourModelType model)
{
   ...//your code
   return PartialView("_YourPartialViewName", YourViewModel);
}

注意：不要忘记添加对＆＃34; jquery.unobtrusive-ajax.min.js＆＃34;的引用。在您的视图中使用ajax。

Answer 4

所以，假设您有View with PartialView，必须通过按钮点击更新：

<div class="target">
 @{ Html.RenderAction("UpdatePoints");}
</div>

<input class="button" value="update" />

有一些方法可以做到这一点。例如，您可以使用jQuery：

<script type="text/javascript">
    $(function(){    
        $('.button')click(function(){        
            $.post('@Url.Action("PostActionToUpdatePoints", "Home")').always(function(){
                $('.traget').Load('/Home/UpdatePoints');        
            })        
        });
    });        
</script>

PostActionToUpdatePoints是具有[HttpPost]属性的Action，用于更新点

如果您在动作UpdatePoints（）中使用逻辑来更新点，可能您忘记为其添加[HttpPost]属性：

[HttpPost]
public ActionResult UpdatePoints()
{    
    ViewBag.points =  _Repository.Points;
    return PartialView("UpdatePoints");
}

如何通过操作结果从另一个局部视图更新局部视图

4 个答案: