Проверка ввода с помощью плагина автозаполнения jQuery - PullRequest
Новая
       37

Проверка ввода с помощью плагина автозаполнения jQuery

0 голосов
/ 28 июля 2010

Я использую стандартный плагин автозаполнения здесь .

У меня есть два текстовых поля в форме, имя элемента и идентификатор элемента. Идея состоит в том, что я хочу, чтобы пользователь искал элемент по имени, но при отправке формы мне действительно нужен идентификатор элемента.

Я возвращаю json из действия ASP.NET MVC, которое используется при автозаполнении.

Пользователь начинает вводить имя элемента, появляется список автозаполнения и форматируется для отображения имени элемента из объекта json. Затем пользователь может щелкнуть имя из списка, и идентификатор элемента будет заполнен в другом текстовом поле (которое фактически будет скрытым полем, когда все будет работать). Затем я могу проверить наличие значения во втором текстовом поле перед отправкой формы.

В приведенном выше сценарии все прекрасно работает. Но в том, что у меня есть, есть две огромные ошибки:

1) Пользователь должен нажать на элемент в списке, чтобы сработала функция result. Поэтому, если есть элемент яблок , и пользователь просто вводит яблок непосредственно в текстовое поле, идентификатор элемента не заполняется.

2) Пользователь может выбрать яблок из списка, который заполняет идентификатор элемента. Затем пользователь передумал и вернулся к текстовому полю и набрал апельсины . Опять же, если он фактически не нажимает на элемент в списке, идентификатор элемента не изменяется, и теперь, когда форма отправляется, отправляется неправильный идентификатор элемента. То же самое, если пользователь вводит что-то, что не является допустимым выбором, например, он меняет текстовое поле на appleblahblahblah , идентификатор элемента apple все еще будет отправлен, даже если правильный выбор предмета не сделан.

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

Кто-нибудь знает, как решить эту проблему?

Мой код ниже, на данный момент все довольно стандартно ... 

$('#ItemSearch').autocomplete("MyAction/FindItems", {
    dataType: 'json',
    parse: function(data) {
        var parsed = [];
        for (var i = 0; i < data.length; i++) {
            parsed[parsed.length] = {
                data: data[i],
                value: data[i].Value,
                result: data[i].Key
            };
        }
        return parsed;
    },
    formatItem: function(row) {
        return row.Value;
    }
}).result(function(event, data, formatted) {
    $(this).val(data.Value);
    $('#ItemId').val(data.Key);
}).blur(function() {
    // this is where I was trying to force an update of the item id textbox, 
    // but it doesn't work.
    $(this).search();
});

Я был бы признателен за любые указатели. Спасибо

Редактировать: Если есть лучшее автозаполнение, которое обрабатывает json и принудительную проверку, я был бы рад услышать предложения, так как это может быть проще, чем попытаться заставить это работать.

1 Ответ

0 голосов
/ 28 июля 2010

Лучшим автозаполнением может быть автозаполнение пользовательского интерфейса jQuery , для которого требуется пользовательский интерфейс jQuery (довольно большая библиотека), но он более гибкий.В нем есть много событий, которые вы можете использовать для принудительной проверки.

...