更新面板中的ASP.NET MVC 3

我正在寻找一种方式在ASP.NET MVC 3，做一个“更新面板”我发现这个链接：How to make update panel in ASP.NET MVC但没有奏效。更新面板中的ASP.NET MVC 3

所以，我这样做，我认为：

<div> 
    <input type="text" id="userName" /> 
    <button type="button" onclick="searchUserByName()">Search</button> 
</div> 
<div id="usersPanel"> 
    @{Html.RenderPartial("_UserList", Model);} 
</div> 
<script type="text/javascript"> 

    function searchUserByName() { 
     var userName = $("#userName").val(); 

     $.post('@Url.Action("SearchUserByName")', 
      {username: userName}, 
      function (htmlPartialView) { 
       $("#usersPanel").html(htmlPartialView); 
      } 
     ); 
    } 

</script>

而且在我的控制器：

public ActionResult SearchUserByName(string userName) 
{ 
    List<User> users = // code to search users by name 

    return PartialView("_UserList", users); 
}

但我不知道，如果是做一个好（或右）的方式，或者如果有一种方法用asp.net的MVC 3，有一个更好的方式来做到这一点，或者用asp.net MVC 3做到这一点？

来源

2012-01-27 Vinicius Ottoni

我会那样做，除了我返回JSON瓦特/列表项代替。似乎有点傻，每次将所有用户重新添加到usersPanel。 – 2012-01-27 15:25:47

只需使用Ajax请求从你的行动方法的结果。它基本上和asp.net中的更新面板一样。

所以像下面这样。

$.ajax({ 
async: false, 
cache: false, 
type: 'POST', 
    url: /controller/action, 
    data: { id: idParam }, 
    beforeSend: function (XMLHttpRequest) { 
     if (confirmMessage !== undefined) { 
      return confirm(confirmMessage); 
     } 
     return true; 
    }, 
    success: function (data) { 
     // do stuff 
    }, 
    error: function() { 
     alert('An error occured'); 
    } 
});

来源

2012-01-27 15:17:11 JoJa

我会那样做。

你可能也想看看客户端库处理绑定等貌似knockoutjs将被列入MVC4

来源

2012-01-27 15:10:58 jgauffin

要继续使用服务器端，我必须使用jquery吗？这LIB仅仅是UI，换句话说，我去拿从$。员额或$就和设置，查看与knockoutjs定义的模型，结果呢？因为，如果这只适用于UI，所以它不能完全满足我需要，但看起来像一个伟大的库。无论如何，谢谢你！ – 2012-01-27 17:36:35

是的。你仍然会使用jQuery来做Ajax。但是knockoutjs可以将相同的信息绑定到页面上的多个位置。 – jgauffin 2012-01-27 18:30:42

在View：

<script type="text/javascript"> 

var userName = $("#userName").val(); 

$.ajax({ 
      url: "/<ControolerName>/SearchUserByName", 
      type: "POST", 
      data: { userName: userName}, 
      success: function (result) { 
       $('#divResults').html(result); 
      }, 
      error: function (ex) { 
       alert("Error"); 
      } 

<script> 
<div id="divResults"> 
</div>

在控制器：

public PartialViewResult SearchUserByName(string userName) 
{ 
    List<User> users = // code to search users by name 

    return PartialView("_users", users); 
}

来源

2012-01-27 15:18:06 Anwar

除了改写这个问题给出的代码，什么是你的答案吗？ – 2012-01-27 15:20:11

更新面板中的ASP.NET MVC 3

回答

相关问题