JQuery Автозаполнение источника является функцией - PullRequest
Новая
       13

JQuery Автозаполнение источника является функцией

3 голосов
/ 16 ноября 2011

Я использую автозаполнение JQuery UI для разных полей. Чтобы получить данные, я использую функцию в качестве источника. Это прекрасно работает! Мне было интересно, есть ли способ не использовать функцию анонима в источнике, но объявить универсальный, который будет иметь параметр для перенаправления на правильный URL. Я новичок в JS и JQuery, и поэтому я не знаю, откуда поступают запрос параметров и ответ в функции анонима. Вот что я пытаюсь сделать: 

    $ac.autocomplete({
        //Call the function here, but what are the parameter request and response???
        source: autocomplete(),
        minLength: 1
    });

Вот функция, которую я хотел бы вызвать 

function autoComplete(request, response, url) {
    $.ajax({
        url: '/Comp/'+url,
        dataType: "json",
        type: "POST",
        success: function (data) {
            response($.map(data, function(item) {
                return { label: item, value: item, id: item };
            }));
        }
    });
}

Большое спасибо за вашу помощь.

Ответы [ 3 ]

3 голосов
/ 17 ноября 2011

Вы должны использовать 

source: autoComplete

вместо 

source: autocomplete()

Еще одно замечание.Реализация по умолчанию для jQuery UI Autocomplete использует только value и label и не использует id.

1 голос
/ 18 ноября 2013

Я приведу пример ситуации, которая произошла со мной, может служить примером:

Ситуация: после того, как пользователь выберет ключевое слово с автозаполнением Jquery, не разрешите его в списке. С учетом того, что запрос выполняется одинаково, т.е. без изменений кот. на стороне сервера.

Код выглядел так: 

$( "#keyword-search" ).autocomplete({
    minLength: 3 ,
    source: function( request , response ) {
        var param = { keyword_type: type , keyword_search: request.term } ;
        $.ajax({
            url: URI + 'search-to-json',
            data : param,
            dataType: "json",
            type: "GET",
            success: function (data) {
                response($.map(data, function( item ) {
                    /* At this point I call a function, I use to decide whether to add on the list to be selected by the user. */
                    if ( ! is_record_selected( item ) ) {
                        return item;
                    }
                }));
            }
        });
    } ,
    select: function( event , ui ) {
        /* Before you add, looking if there is any cell */
        /* If it exists, compare the id of each cell not to add an existing */
        if ( validate_new_keyword( ui ) ) {
            add_cell( ui ) ;
        }
    } ,
});

/* Any validation... */
function validate_new_keyword( ui ) {
    var keyword_id = $.trim(ui.item.id) ;
    Any condition...
    if (keyword_id > 0) {
        return true ;           
    }

    return false ;
}

/* This function checks if a keyword has not been selected by the user, it checks for the keyword_array. */
function is_record_selected( item ) {
    var index = jQuery.inArray( item.id , keyword_array ) ;
    return index == -1 ? false : true;
}

Obs: Таким образом, можно использовать функцию внутри «source» и «select». = Р

0 голосов
/ 25 января 2013

Переформатирование вашего вопроса будет представлять собой решение проблемы. :) 

 $ac.autocomplete({
     minLength: 1 ,
     source: function(request, response, url){
                var searchParam  = request.term;

    $.ajax({
              url: '/Comp/'+url,
             data : searchParam,
             dataType: "json",
            type: "POST",
            success: function (data) {
                    response($.map(data, function(item) {
                    return { 
                        label: item.Firstname,
                        value: item.FirstName
                        };
                    });
                    }
            });//ajax ends 
            }
 }); //autocomplete ends

jQuery UI ожидает объекты request и response . request.term даст вам текст, который вводит пользователь, а метод response вернет элементы label и value в фабрика виджетов для отображения выпадающего списка

P.S: при условии, что в строке JSON содержится ключ FirstName !

...