Как вернуть произвольные объекты JSON в список автозаполнения jQuery? - PullRequest
Новая
       6

Как вернуть произвольные объекты JSON в список автозаполнения jQuery?

1 голос
/ 16 октября 2011

jQuery part:

У меня есть jQuery UI 1.8 Форма автозаполнения, которая выбирает удаленные данные JSON из контроллера Rails. 

$('input#test').autocomplete({
    source: function( request, response ) {
      $.getJSON(
        "<%= find_stuff_url(:format => :json) %>",
        request,
        function(data){
          console.log(data);
          function(data) {
            $.map(data, function(item) {
            return {
              "label" : item.control_point.label,
              "value" : item.control_point.geonames_uri
            }
            });
        });
    },
    minLength: 2,
    select: function( event, ui ) {
        // ...
    }
  });

… что я получаю:

Этот контроллер Rails просто возвращает массив Objects (фактически ActiveRecord экземпляров), сериализованный в JSON.Я хотел бы использовать эти данные для заполнения списка автозаполнения.Сейчас я получаю массив сериализованных объектов ActiveRecord - например, один из этих объектов может быть: 

Object
  control_point: Object
    geonames_uri: "http://sws.geonames.org/5128581/"
    label: "New York (US)"
    lat: "40.7142691"
    lng: "-74.0059729"
    map_id: 1
    name: "New York City"

Что мне нужно:

Однако, jQuery Autocomplete , вероятно, хочет, чтобы массив JSON содержал объекты id и label для заполнения списка, но у меня их нет.Это то, что написано в документации :

Ответный обратный вызов, который ожидает, что один аргумент будет содержать данные, предлагаемые пользователю.Эти данные […] могут быть в любом из описанных выше форматов для простых локальных данных (String-Array или Object-Array с меткой / значением / обоими свойствами).

Я не совсем понимаючто подразумевается под свойствами "String-Array или Object-Array with label / value / both".

В этом примере мой вывод был бы списком этих control_point объектов, показанных как: 

label: "New York (US)", value: <the geonames_uri>
label: "New York (Somewhere else)", value: <another geonames_uri>
…

Я пытался адаптировать код из документации, используя $.map, нопохоже, что он не работает (т.е. автозаполнение ничего не показывает).

Как передать произвольный объект JSON в jQuery Autocomplete, чтобы он отображал список результатов?Более конкретно: что я должен вставить в function(data){}?

Ответы [ 3 ]

5 голосов
/ 16 октября 2011

В документации (по той же ссылке, которую вы разместили) объясняется, что подразумевается под терминами String-Array и Object-Array:

Локальные данные могут быть простым массивом строк илисодержит объекты для каждого элемента в массиве, со свойством label или value или с обоими.Свойство метки отображается в меню предложений.Значение будет вставлено в элемент ввода после того, как пользователь выберет что-то из меню.Если указано только одно свойство, оно будет использоваться для обоих, например.если вы предоставляете только значения-свойства, значение также будет использоваться в качестве метки.

Так что в конце дня это либо String-Array: ["value1", "value2", ...], либо Object-Array: 

[
  { label:"First Value", value:"value1" },
  { label:"Second Value", value:"value2" },
  ...
]

Вы можете либо внести необходимые изменения на стороне сервера для сериализации данных, чтобы они выглядели подходящими, либо map на стороне клиента, как в в этом примере .В любом случае конечный результат должен быть в одном из указанных выше форматов.

Так, например, что-то вроде этого: 

function(data) {
response( $.map(data, function(item) {
  return {
  "label" : item.control_point.label,
  "value" : item.control_point.geonames_uri
  }
}));
2 голосов
/ 16 октября 2011

Это то, что вы хотите сделать на стороне сервера, то есть в Ruby on Rails.Вы можете сделать следующее:

  • Дайте вашей модели (сущности ActiveRecord, что угодно) метод toAutocompleteResult, который возвращает Object только со свойствами метки и значения.
  • В вашемконтроллер (return_stuff_url?), переберите ваш набор результатов, вызовите toAutocompleteResult() для них и поместите результаты в своего рода массив.
  • Преобразуйте массив в JSON и верните его.

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

Редактировать: кстати, массив строк JSON выглядит так: 

["String 1", "String 2", "String 3"]

И массив объектов JSON будет выглядеть такэто: 

[
    { "label" : "Label 1", "value": "Value 1" },
    { "label" : "Label 2", "value": "Value 2" }
]
1 голос
/ 09 февраля 2012

Вам нужно что-то подобное на сервере 

def my_autocomplete_controller_method
  q = params[:term]
  records = Record.find_by_whatever q
  records.map { |record| {label: record.your_label, value: record.your_value} }
end

На клиенте (coffescript): 

$find_field.autocomplete
   source: /path_to_controller_method
...