PagedList MVC与JQuery UI自动完成导致错误

时间:2022-08-24 21:55:16

I'm trying to use JQuery UI Autocomplete on a text box to filter through a Paged List and dynamically update the list so it only shows anything that starts with the value from the filter. However whenever I start typing into the search box I get the following error:

我正在尝试在文本框中使用JQuery UI Autocomplete来过滤分页列表并动态更新列表,以便它只显示以过滤器中的值开头的任何内容。但是每当我开始在搜索框中输入时,我都会收到以下错误:

Syntax Error: Unexpected Token <

语法错误:意外令牌<

Here's my controller:

这是我的控制器:

    [HttpGet]
    public ActionResult Index(string filter, int currentPage = 1)
    {
        List<string> allEmails = null;

        if (!string.IsNullOrEmpty(filter))
        {
            allEmails = dataContext.Emails
                .Where(x => x.email.StartsWith(filter))
                .Select(x => x.email)
                .ToList();
        }
        else
        {
            allEmails = dataContext.Emails
                .Select(x => x.email)
                .ToList();

        }
        PagedList<string> model = new PagedList<string>(allEmails, page, pageSize);
        ViewBag.Emails = allEmails.OrderBy(x => x).Skip((page - 1) * pageSize).Take(pageSize);
        ViewBag.Filter = filter;
        return View(model);
    }

Here's My view:

这是我的观点:

 @model PagedList<string>
 @using PagedList
 @using PagedList.Mvc

<div id="paginatedDiv">
    <table id="pageinatedTable">
         <tr>
             <th>
                 Email
             </th>
         </tr>
         @foreach (var item in ViewBag.Emails)
         {
              <tr>
                 <td>
                     @item
                 </td>
             </tr>
         }
     </table>

     @Html.PagedListPager(Model,
        (page) => Url.Action("Index", "Home", new
        {
            page,
            pageSize = Model.PageSize,
            filter = ViewBag.Filter
        }),
        PagedListRenderOptions.ClassicPlusFirstAndLast)
 </div>
 @Html.TextBox("search")


 @section scripts
 {
     <script type="text/javascript">
         $(document).ready(function () {
              $('#search').autocomplete({
                     source: function(request, response)
                     {
                        $.ajax({
                            url: '@Url.Action("Index", "Home")',
                            dataType: "json",
                            contentType: 'application/json, charset=utf-8',
                            data: {
                                filter : $("#search").val(),
                                page : '@Model.PageNumber'
                            },

                            error: function (xhr, status, error) {
                                alert(error);
                            }

                        })},
                      minlength: 1
             });

         });
     </script>
  }

Is what I'm trying to do here possible? Am I going about it the wrong way? If you need more information let me know.

我在这里想做的可能吗?我是以错误的方式去做的吗?如果您需要更多信息,请告诉我。

1 个解决方案

#1


The Ajax function is returning a HTML error which is trying to getting parsed to the function. It will fail and error out because the first character will be '<' like

Ajax函数返回一个HTML错误,试图解析为该函数。它将失败并输出错误,因为第一个字符将是'<'

#1


The Ajax function is returning a HTML error which is trying to getting parsed to the function. It will fail and error out because the first character will be '<' like

Ajax函数返回一个HTML错误,试图解析为该函数。它将失败并输出错误,因为第一个字符将是'<'