Поиск автозаполнения JQuery в начале - PullRequest
6 голосов
/ 26 апреля 2011

Используя JQuery AutoComplete UI, 1.8, мне нужно изменить поиск, чтобы он соответствовал только в начале строки.Фон мой источник исходит от вызова ajax, который я не контролирую, который возвращает 15 000 и соответствующие им PK.значение - это имя, а Id - целое число PK. Приведенный ниже код работает, но так как я ищу в 15,00 строках, которые совпадают с любой точкой в ​​строке, она слишком медленная.Я видел этот пост, ссылку, но я не мог понять, как это сделать, не потеряв поле Id в источнике.

Мне нужен поиск, чтобы соответствовать только началу значения в data.d безпотеря поля Id.Это приложение ASP.Net, но я не думаю, что это имеет значение.Идеи?

$("#companyList").autocomplete({
              minLength: 4,
              source: data.d,
              focus: function(event, ui) {
                  $('#companyList').val(ui.item.value);
                  return false;
              },
              select: function(event, ui) {
                  $('#companyList').val(ui.item.value);
                  $('#<%= hdnCompanyListSelectedValue.ClientID %>').val(ui.item.Id);
                  return false;
              }
          });

1 Ответ

15 голосов
/ 26 апреля 2011

Вот возможное решение для вас. Вы, ребята, были на правильном пути. Я использовал строку json в качестве источника данных, и я знаю, что текст, который я хочу сопоставить, находится в поле item.label. Это может быть в item.value для вас: Поля ввода:

<input type="text" id="state" name="state" /> 
<input
readonly="readonly" type="text" id="abbrev" name="abbrev" maxlength="2"
size="2"/>
<input type="hidden" id="state_id" name="state_id" />

JQuery

var states = [{"id":"1","label":"Armed Forces Americas (except Canada)","abbrev":"AA"},{"id":"2","label":"Armed Forces Africa, Canada, Europe, Middle East","abbrev":"AE"},{"id":"5","label":"Armed Forces Pacific","abbrev":"AP"},{"id":"9","label":"California","abbrev":"CA"},{"id":"10","label":"Colorado","abbrev":"CO"},{"id":"14","label":"Florida","abbrev":"FL"},{"id":"16","label":"Georgia","abbrev":"GA"},{"id":"33","label":"Northern Mariana Islands","abbrev":"MP"},{"id":"36","label":"North Carolina","abbrev":"NC"},{"id":"37","label":"North Dakota","abbrev":"ND"},{"id":"43","label":"New York","abbrev":"NY"},{"id":"46","label":"Oregon","abbrev":"OR"}];

$("#state").autocomplete({
    source: function(req, response) { 
    var re = $.ui.autocomplete.escapeRegex(req.term); 
    var matcher = new RegExp( "^" + re, "i" ); 
    response($.grep( states, function(item){ 
        return matcher.test(item.label); }) ); 
     },
minLength: 2,
select: function(event, ui) {
$('#state_id').val(ui.item.id);
$('#abbrev').val(ui.item.abbrev);
}
});

А вот рабочий пример: http://www.jensbits.com/demos/autocomplete/index3.php

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...