Jquery Ajax 第一次替换 DIV 但第二次不替换 (MVC4)

Question

查看

@section Scripts{
        <script>
            $(function () {
                $('#UserSearch').click(function () {
                    $.ajax({
                        url: this.href,
                        cache:false,
                        type: 'POST',
                        data: {id:$('#SearchName').val()},                    
                        success: function (result) {
                            $('#ajaxsample').html(result);
                        }
                    });
                    return false;
                });
            });
        </script>
    }

    <table>
    <tr>

                <td>
                    <input type="text" id="SearchName"/>
                </td>

                <td>
                    <a id="UserSearch" href='@Url.Action("Contribute", "Project")'>Search</a>

                </td>
            </tr>
        </table>

        <div id="ajaxsample">
            T_T
        </div>

控制器

[HttpPost]
        public ActionResult Contribute(String id)
        {
                String UserName = id;
                PMSDBContext PMP = new PMSDBContext();
                List<_ContributeViewModel> result = new List<_ContributeViewModel>();

                result = PMP.Users
                             .Join(PMP.Friendships, u => u.UserID,
                             f => f.FriendID,
                             (u, f) => new { u, f })
                             .Where(m => m.f.UserID == 1 && m.u.Name.Contains(UserName) && m.f.Status == 1)
                             .Select(s => new _ContributeViewModel
                             {
                                 UserID = s.u.UserID,
                                 PhoneNo=s.u.PhoneNo,
                                 Facebook=s.u.Facebook,
                                 Name=s.u.Name
                             }
                             ).ToList();

            return View("UserSearch",result);
        }

用户搜索视图

@model List<PMS.View_Model._ContributeViewModel>
@{
    ViewBag.Title = "SearchResult";
}
<table>

    <tr>
        <th>
            <u>Search Result</u>
        </th>

    </tr>

    <tr>
        <th>Name</th>
        <th>PhoneNo</th>
        <th>FaceBook</th>
    </tr>
    @foreach (var item in Model.Where(model => model.UserID != null))
    {
        <tr>
            <td>
                @Html.DisplayFor(model => item.Name)
            </td>
            <td>
                @Html.DisplayFor(model => item.PhoneNo)
            </td>
            <td>
                @Html.DisplayFor(model => item.Facebook)
            </td>
        </tr>
    }
</table>

当我第一次单击带有某些文本的搜索按钮时 textbox，UserSearch View 将 "T_T" 替换为数据库结果，但第二次页面重新加载并 "T_T" 替换 UserSearch 视图和第三次用户搜索视图再次替换 "T_T" 并且这种情况不断发生...问题是我可以做什么 UserSearch View 来替换每次点击的 "T_T"？

Answer 1

您可以使用 tagbuilder 构建 html 标记并发送

而不是返回完整视图

[HttpPost]
public MvcHtmlString Contribute(String id)
{
   String UserName = id;
   PMSDBContext PMP = new PMSDBContext();
   List<_ContributeViewModel> result = new List<_ContributeViewModel>();
   result = PMP.Users
               .Join(PMP.Friendships, u => u.UserID,
                                 f => f.FriendID,
                                 (u, f) => new { u, f })
                                 .Where(m => m.f.UserID == 1 && m.u.Name.Contains(UserName) && m.f.Status == 1)
                                 .Select(s => new _ContributeViewModel
                                 {
                                     UserID = s.u.UserID,
                                     PhoneNo=s.u.PhoneNo,
                                     Facebook=s.u.Facebook,
                                     Name=s.u.Name
                                     }
                                     ).ToList();

    StringBuilder output = new StringBuilder();
    TagBuilder ulTag = new TagBuilder("ul");
    foreach (var item in result )
    {

                output.Append(ulTag.ToString());
                ulTag = new TagBuilder("ul");

     }
     output.Append(ulTag.ToString();
     return output.ToString();
}

我认为您面临的问题是由于呈现整个页面以及 div 中的替换问题所致。

Answer 2

试试下面的代码

$('#UserSearch').click(function () {
     $.ajax({
         url: '/Project/Contribute',
         dataType:'html',
         type: 'POST',
         data: { id:$('#SearchName').val() },                    
         success: function (result) {
           $('#ajaxsample').html(result);
         }
    });
    return false;
});

你的行动将是

[HttpPost]
public PartialViewResult Contribute(String id)
{
     //Your logic. .....
     return PartialView("UserSearch",result);
}

通常它会工作...

Jquery Ajax 第一次替换 DIV 但第二次不替换 (MVC4)

Jquery Ajax replace DIV in first time but not in second time(MVC4)

ajax

jquery

asp.net-mvc-4