Отображение метки, но отправка идентификатора в jquery - PullRequest
0 голосов
/ 19 сентября 2011

Я использую автозаполнение AJAX. Идея состоит в том, чтобы отобразить HTML-страницу справа от поля ввода на основе условий поиска.

HTML PART: [и с использованием rails: layout => false]

Страница, которая должна быть отображена, выглядит следующим образом, когда поисковый термин dolore :

{"label":"laboriosam praesentium amet ea et qui non consequatur quod","value":1}
{"label":"aut omnis non quia aut animi","value":2}
{"label":"eveniet pariatur dicta quae ut","value":3}
{"label":"voluptatem ad quaerat aut atque est alias a quo","value":4}
{"label":"dolorem labore nisi natus labore dolorum eum","value":5}

Часть AJAX: [с использованием AJAX, непосредственно вставленной из автозаполнения]

  $(document).ready(function(){
    $('#title_name').keyup(function(){
      var input = $('#title_name').val();
     if (input.length > 2) {
      $.ajax({
           url: "/search/titles",
           data: "search="+input,
           success: function(msg){
             $("#suggest-title").html(msg);
             $("#suggest-title div .titlelist").mouseover(function(){
               $("#suggest-title div .titlelist").removeClass("search_hover");
               $(this).addClass("search_hover");
             });
             $("#suggest-title .titlelist").click(function(){
              var field_value = $(this).html();
              $("#title_name").val(field_value);
              $("#title_name").append('<input type="hidden" name="title_id" value="5" />');
              $("#suggest-title").remove();
             });
           }
         });
     }
    });
  });

TODO: Идея состоит в том, чтобы показать часть «метки» пользователю при поиске, но при отправке идентификатора обратно на сервер.

1 Ответ

0 голосов
/ 19 сентября 2011

почему вы не используете jqueryui автозаполнение ?

Тогда вы можете сделать:

var availableTags = [{label:"ActionScript", id:1},{label: "AppleScript", id:2}];
$("#tags").autocomplete({
    source: availableTags,
    select: function(evt, ui){
        alert(ui.item.id);
        //post the id to the server
    }
});

скрипку здесь: http://jsfiddle.net/rmEr7/1/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...