Автозаполнение jQuery против Combobox

#jquery #jquery-autocomplete

#jquery #jquery-автозаполнение

Вопрос:

Я вызываю веб-службу (используя SPServices), чтобы получить все мои элементы в массив, а затем использовать этот массив в моем вызове автозаполнения. Он отлично работает, однако у меня есть несколько вопросов / проблем

  1. Как я могу запретить пользователю выбирать значения, которых нет в списке выбора? Я думаю, что это делает поле со списком, однако я не хочу загружать весь список на страницу… что приводит к # 2

  2. Я использую список выбора, в котором будет несколько тысяч элементов (в настоящее время несколько сотен), из того, что я собираю с помощью автозаполнения, он загружает все значения выбора в массив, а затем использует их для выбора. это правильно? Есть ли лучший способ обойти это, чтобы я мог вызвать веб-службу с моими частично введенными словами и только массивировать результаты, а не все элементы? Будет ли это уникальным решением за пределами автозаполнения или combobox?

Спасибо, Дэвид

Комментарии:

1. Используете ли вы автозаполнение jQueryUI?

2. Да, объект.автозаполнение

Ответ №1:

Итак, вот что я сделал…

При нажатии клавиши вызовите мой веб-сервис с новым термином, а затем поместите возвращенные результаты в автозаполнение. Кроме того, результаты затем кэшируются.

Я также проверяю, когда пользователь продолжает, что указанное значение содержится в массиве, гарантируя, что они не перепутали значение.

 function setVendorLookup() {
    var term = $(this).val().toLowerCase();
    if (term.length > 2) {
        if (vendors.join(" ").toLowerCase().indexOf(term) == -1) { //some caching
            vendors = [];
            $().SPServices({
                operation: "GetListItems",
                listName: "Yellow Pages",
                async: false,
                CAMLViewFields: "<ViewFields><FieldRef Name='VENDOR_ID'/><FieldRef Name='NAME1'/><FieldRef Name='CITY'/><FieldRef Name='STATE'/></ViewFields>",
                CAMLQuery: "<Query><Where><Or><Contains><FieldRef Name='VENDOR_ID' /><Value Type='Text'>"   term   "</Value></Contains>"  
                    "<Contains><FieldRef Name='NAME1' /><Value Type='Text'>"   term   "</Value></Contains></Or></Where></Query>",
                completefunc: function (xData, Status) {
                    $(xData.responseXML).find("[nodeName='z:row']").each(function () {
                        vendors.push($(this).attr("ows_VENDOR_ID")   " - "   $(this).attr("ows_NAME1")   ", "   $(this).attr("ows_CITY")   ", "   $(this).attr("ows_STATE"));
                    });
                }
            }); //SPServices
        }
        $(".vendor").autocomplete({
            source: vendors,
            minLength: 3
        });
    } else
        vendors = [];

}

function validate()
{
        if (jQuery.inArray($(".vendor").val(), vendors) == -1) {
            myAlert("Validation Error", "Please select a valid vendor");
            return false;
        }
}