JQuery UI автозаполнение с пользовательскими данными от друзей Facebook Graph API

Question

Я хочу, чтобы мой график facebook api / me / список друзей в поле автозаполнения. Я хочу выбрать моего друга, выбрать один из них и иметь его идентификатор.

Ответ Facebook с объектом «data» json с именем и идентификатором. Отлично! Какой-то код:

$(document).ready(function(){

    FB.api('/me/friends', function(fbresponse){

        $("#input_13").autocomplete({
                source : function(request, response){
                    response($.map(fbresponse.data, function(e){
                        return{
                            id : e.id, 
                            name : e.name
                        }
                    }))
                },
                select : function(event, ui){
                            alert(ui.item.name);
                            $("#input_13").val(ui.item.name);
                            $("#input_10").val(ui.item.id);
                            return false;
                }
            }).data("autocomplete")._renderItem = function(ul, item){
                    return $("<li></li>")
                            .data("item.autocomplete", item)
                            .append( $("<a></a>").html(item.name) )
                            .appendTo(ul); 
                        };

    });


});

Результаты на уровне 90%, когда я начинаю печатать, появляется список моих друзей, но это порядок от первого до конца, он не фильтруется. Пример: Мой список завершен: марко Massimo Marino Mimmo Симона Сара Sonia

когда я начинаю с "s" должен приводить только Симона Сара Sonia

но список результатов не меняется.

Что случилось? Большое спасибо.

Answer 1

Поскольку ваше исходное свойство указывает на функцию, которая вызывается всякий раз, когда плагину требуется источник данных, проблема заключается в следующем: FB Graph API не принимает параметр «term» при поиске друзей, поэтому он всегда возвращает одни и те же данные.на основе вашего вклада.Вам нужно что-то вроде этого:

var makeItems = function(fbresponse) {
  return $.map(fbresponse, function(item) {
    return {
      label: item.name,
      value: item.id,
    }
  });
};

var setAutoComplete = function(parsed_items) {
  $("#input_13").autocomplete({
    source : parsed_items,
    select : function(event, ui){
      alert(ui.item.name);
      $("#input_13").val(ui.item.name);
      $("#input_10").val(ui.item.id);
      return false;
    }
  }).data("autocomplete")._renderItem = function(ul, item) {
    return $("<li></li>")
      .data("item.autocomplete", item)
      .append( $("<a></a>").html(item.name) )
      .appendTo(ul); 
  };
};

FB.api('/me/friends', function(fbresponse) {
  setAutoComplete(makeItems(fbresponse.data));
});

Он сделает только один запрос, получит всех друзей и установит переменную с массивом проанализированных элементов, чтобы фильтр мог действовать в массиве.

Я надеюсь, это поможет вам.

Answer 2

взгляните на этот пример кода, он работает нормально.
http://blogs.microsoft.co.il/blogs/alon_nativ/archive/2011/05/30/search-facebook-friends-with-jquery-autocomplete.aspx