JQuery автозаполнения выбрать не запускается

Question

Я использую JQuery jquery-1.10.2 и JQuery UI 1.11.4

Здесь функция автозаполнения:

$("#txtPOI").autocomplete({ 
    source: function(request, response) { 
     $.ajax({ 
      url: '<?php echo site_url("crowd/get_POIs") ?>', 
      data: {cat: selectedCode, q: request.term}, 
      dataType: "json", 
      type: "post", 
      success: function(data) { 

       response($.map(data, function(item) 
       { 
        return{ 
          label: item.title, 
          value: item.title, 
          contentid: item.contentid, 
          latitude: item.latitude, 
          longitude: item.longitude 
         } 
       })); 

      }, 
      fail : function (jqXHR, textStatus, errorThrown) { 
       console.log(jqXHR); 
       console.log(textStatus); 
       console.log(errorThrown); 
      }, 
      select: function(event, ui) { 
       $("#txtPOI").val(ui.item.latitude); 
       alert('selected'); 
       /* 
       alert(ui.item.contentid); 
       log(ui.item ? 
        "Selected: " + ui.item.label : 
        "Nothing selected, input was " + this.title); 
       alert(ui.item.value); 
       */ 
      }, 
      open: function(event, ui) { 
       $(".ui-autocomplete").css("z-index", 1000); 
      }, 
      minLength: 3 

     }); 
    } 
}); 

Ответ Аякса успешно возвращающий данные из базы данных. Однако, когда я пытался что-то сделать внутри select, ничего не происходило, кажется, что select не запускается. Я хотел бы получить значение ui.item.contentid, а также ui.item.latitude и ui.item.longitude по выбору элемента автозаполнения.

Почему не произошло событие select? Как решить эту проблему?

Answer 1

Выбрать вариант для объекта автозаполнения не для объекта Ajax.

Попробуйте это:

$("#txtPOI").autocomplete({ 
 
    source: function(request, response) { 
 
     $.ajax({ 
 
      url: '<?php echo site_url("crowd/get_POIs") ?>', 
 
      data: {cat: selectedCode, q: request.term}, 
 
      dataType: "json", 
 
      type: "post", 
 
      success: function(data) { 
 

 
       response($.map(data, function(item) 
 
       { 
 
        return{ 
 
          label: item.title, 
 
          value: item.title, 
 
          contentid: item.contentid, 
 
          latitude: item.latitude, 
 
          longitude: item.longitude 
 
         } 
 
       })); 
 

 
      }, 
 
      fail : function (jqXHR, textStatus, errorThrown) { 
 
       console.log(jqXHR); 
 
       console.log(textStatus); 
 
       console.log(errorThrown); 
 
      } 
 
     }); 
 
    }, 
 
    select: function(event) { 
 
     // do what ever you want to do... 
 
    } 
 
});