jQuery UI Ajax 自动完成区分大小写 ASP.net MVC

Posted 2023-04-13

【中文标题】jQuery UI Ajax 自动完成区分大小写 ASP.net MVC

【英文标题】：jQuery UI Ajax Autocomplete case sensitive ASP.net MVC

【发布时间】：2019-05-29 18:40:39

【问题描述】：

我在这里使用 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);
  

【参考方案1】：

您需要使用StartsWith 中的this overload 并使用StringComparison 类型指定，以便进行不区分大小写的比较：

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

【讨论】：

如果可以为搜索建议列表添加匹配的粗体文本？

不确定，但会在客户端用 javascript 完成

【参考方案2】：

添加匹配文本粗体自动完成建议列表是可能的 在函数内部添加此代码

$.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);
    ;