簡體   English   中英

jQuery UI Ajax自動完成區分大小寫ASP.net MVC

[英]jQuery UI Ajax Autocomplete case sensitive ASP.net MVC

在這里,我正在為搜索框使用Jquery-ui AutoComplete函數,但如果我搜索小寫字母,則大寫字母沒有出現在建議列表中。如何添加大寫和小寫字母的敏感內容,以搜索此自動完成的Ajax ASP.net MVC

並且,如果有可能添加匹配文本的粗體搜索建議列表?

查看頁面

<input id="app-search">
           <script src="https://code.jquery.com/jquery-2.1.1.js"></script>
        <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
        <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet" />   
        <script>
        (function() {
          $("#app-search").autocomplete({
            minLength: 1, //start letter search
            selectFirst: true,
            autoFocus: true,
            source: function(request, response) {
              $.ajax({
                url: '@Url.Action("GetSearchType")',
                type: "POST",
                dataType: "json",
                data: {
                  SearchType: @Model.SearchType,
                  Prefix: request.term
                },
                success: function(data) {
                  if (!data.length) {
                    var result = [{
                      label: 'No record(s) found',
                      value: response.term
                    }];
                    response(result);
                  } else {
                    response($.map(data.slice(0, 10), function(item) {
                      return {
                        label: item.OrganizationName,
                        value: item.OrganizationName
                      };
                    }))
                  }
                }
              })
            },
          });
        });

         </script>

在MVC Asp.net中的此控制器

     [HttpPost]
public JsonResult GetSearchType(string Prefix)
  {
 List<OrganizationModel> OrganizationList = new List<OrganizationModel>()
   {
   new OrganizationModel {OrganizationName = "Apple" },
   new OrganizationModel { OrganizationName = "name" },
   new OrganizationModel { OrganizationName = "New" },
   };
var CourseList = (from C in OrganizationList
                 where C.OrganizationName.StartsWith(Prefix)
                 select new { C.OrganizationName });
return Json(CourseList, JsonRequestBehavior.AllowGet);
  }

您需要使用StartsWith 重載 ,並使用StringComparison類型進行指定,以便比較時不區分大小寫:

C.OrganizationName.StartsWith(Prefix, StringComparison.InvariantCultureIgnoreCase)

在功能內部 添加匹配的文本加粗的自動完成建議列表可能 在此代碼內

$.ui.autocomplete.prototype._renderItem = function (ul, item) {
        item.label = item.label.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(this.term) + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
        return $("<li></li>")
                .data("item.autocomplete", item)
                .append("<a>" + item.label + "</a>")
                .appendTo(ul);
    };

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM