2012-03-23 2 views
0

Я просмотрел многие предыдущие сообщения об этом, но я думаю, что мой намного проще, чем то, что я нашел. Мое поле запрашивает данные успешно, но не отображает их. Я бы предположил, что это связано с CSS, чтобы отобразить его. Я использую JQuery UI CSS, чтобы отобразить его, как я на других сайтах я проектировал:jQuery autcomplete не отображается

<link href="/css/console/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" /> 

Вот где я пытаюсь отобразить его. Что я здесь делаю неправильно? У меня это работает на других сайтах.

<input type="text" name="userSearch" id="userSearch"/> 
<input class="button" style="top: -1px; margin-left: 5px;" type="button" value="SEARCH" /> 
<input type="hidden" id="hiddenUserWom" value="" /></span></div> 
     <script type="text/javascript" src="/js/jquery-ui-1.8.18.custom.min.js"></script> 
     <script type="text/javascript"> 
     $('#userSearch').autocomplete({ 
      source: '/console/ajax/user_search_autocomplete.php', 
      minLength: 3, 
      select: function (event, ui) { 
       $("#userSearch").val(ui.item.label); 
       $("#hiddenUserWom").val(ui.item.id); 
     } 
     }); 

     $(document).ready(function() { 
      $("#userSearch").focus(); 
     }); 
     </script> 

Здесь успешно возвращаемые данные: Это пример возвращения:

[{ "этикетка": "5U5NU - Девин Паркер - Вакавилль, Калифорния", "идентификатор": «5U5NU "}]

Описание формата данных для JQuery UI, как с официального сайта:

Ожидаемый формат данных

Данные из локальных данных, URL-адрес или обратного вызова может прийти в двух вариантах:

Массив строк: [ «Choice1», «Choice2»] Массив объектов с этикеток и стоимостных свойств: [ {label: "Choice1", value: "value1"}, ...]

Это должно работать должным образом.

Вот сайт: http://wombusiness.com/console/members/

Это поле поиска, нуждающийся автозаполнение.

+0

@ harhahu - Я не думаю, что вы понимаете, как это работает. Может ли кто-нибудь помочь мне здесь? Очевидно, что я хочу отобразить значение VALUE элемента clicked в поле поиска при выборе. Что еще может происходить здесь? – Devin

ответ

2

Поместите автозаполнения внутри вашего $ (документ) .ready

<input type="text" name="userSearch" id="userSearch"/> 
<input class="button" style="top: -1px; margin-left: 5px;" type="button" value="SEARCH" /> 
<input type="hidden" id="hiddenUserWom" value="" /></span></div> 
    <script type="text/javascript" src="/js/jquery-ui-1.8.18.custom.min.js"></script> 
    <script type="text/javascript"> 


    $(document).ready(function() { 
    $('#userSearch').autocomplete({ 
     source: '/console/ajax/user_search_autocomplete.php', 
     minLength: 3, 
     select: function (event, ui) { 
      $("#userSearch").val(ui.item.label); 
      $("#hiddenUserWom").val(ui.item.id); 
    } 
    }); 
     $("#userSearch").focus(); 
    }); 
    </script> 

Задача № 2 $ ("# userSearch") Вал (ui.item.label). Вы переписываете свой автозаполнение своими собственными данными.

+0

Почему атрибут во входном поле 'autocomplete =" off "'? –

+0

Не работает. Данные успешно возвращаются, но не отображаются. – Devin

+0

@mavrick - Где это? У меня нет того, что применяется к любым полям. – Devin

0

Проблема заключается в возврате с PHP. Если вы попробуете то же самое, но с фиксированным набором в массиве в качестве источника, автозаполнение работает идеально.

Кодировка JSON выглядит нормально.

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

Смежные вопросы