Intereting Posts
WooCommerce – Автоматическое добавление или автоматическое удаление продукта в корзину Объединение файлов в один PDF-файл с использованием PHP / linux Использование Cookies в Laravel 4 Борьба с отношением «один ко многим» в форме администратора Сертификат SSL Ebay SDK SSL Как использовать глубокую ссылку на городской дирижабль с помощью PHP как создать безопасную систему регистрации php, позволяющую использовать функцию «сохранить меня в системе»? PHP Mustache 2.1 частичная загрузка НЕ ​​основана на имени файла Ajax POST с функцией Очистка данных пользователя в GET с помощью PHP Использование PHP substr () и strip_tags () при сохранении форматирования и без нарушения HTML Получить определенный элемент из каждого вспомогательного массива Регистрация с помощью CodeIgniter Ion Auth Стратегии для синхронизации двух баз данных mySQL (в разных местах)? php password_verify не работает

Мне нужно расширение jQuery Autocomplete, возвращающее id и имя, используя ajax

Мне нужен пример того, как закодировать автозаполнение jQuery для заполнения product_id, показывая имя_продукта, вызывающего страницу ajax «remote.php»,

 <input name = "product_name" id = "product_name" type = "text" value = "" />
 <input name = "product_id" id = "product_id" type = "hidden" value = "" />


 remote.php:

 $ partial = addslashes ($ _ POST ['partial_search']);
 $ myDataRows = array (); 
 $ result = mysql_query ("SELECT product_id, product_name FROM products 
    WHERE product_name, как «% $ partial%»);
 while ($ row = mysql_fetch_row ($ result)) {
    array_push ($ myDataRows, $ row);
 }
 $ ret = json_encode ($ myDataRows);
 echo $ ret;

Я не уверен, как закодировать автозаполнение jQuery, и если мне нужно изменить remote.php

благодаря

ДОБАВЛЕНО:

Я разработал другое решение:

 <script type = "text / javascript">
 функция nqi_search (тип, id_name, text_name)
 {
     $ ("#" + text_name) .autocomplete ({
         source: "remote.php? & t =" + type,
         minLength: 1,
         select: function (event, ui) {
             $ ("#" + id_name) .val (ui.item.id);
         }
     });
 }
 </ Скрипт>

 <script type = "text / javascript">
 jQuery (document) .ready (function () {

     nqi_search ("product_search", "product_id", "product_name");

     // также вы можете иметь много на одной странице с:
     nqi_search ("vendor_search", "vendor_id", "vendor_name");   


 });
 </ Скрипт>

Есть одна проблема. он не работает, если функция nqi_search помещается в файл .js. Я не имею понятия почему?

Solutions Collecting From Web of "Мне нужно расширение jQuery Autocomplete, возвращающее id и имя, используя ajax"

Вот как я это делаю:

Обратите внимание: я закодировал специальную функцию, в которой json может помечать элемент как сообщение вместо этого, и таким образом вы можете помещать сообщения в список (например, я помещаю «дополнительные элементы X, которые не показаны» для длинных списков). Использовать функцию сообщения, но текст в поле метки и истинное логическое значение для поля сообщения.

Чтобы использовать это на странице, я просто

setupAutocomplete(<id of textbox>,<path to service>); 

  $.ajaxSetup({ type: "POST", contentType: "application/json; charset=utf-8", data: "{}", dataFilter: function(data) { var msg; if (typeof (JSON) !== 'undefined' && typeof (JSON.parse) === 'function') msg = JSON.parse(data); else msg = eval('(' + data + ')'); if (msg.hasOwnProperty('d')) return msg.d; else return msg; }, error: function(msg) { $('#error').html(msg.responseText) } }); // remove this to get rid of custom message handling $.widget("custom.redcomplete", $.ui.autocomplete, { _renderMenu: function(ul, items) { var self = this; $.each(items, function(index, item) { if (item.message) ul.append("<li class='ui-menu-item special-red'>&nbsp;" + item.label + "</li>"); else self._renderItem(ul, item) }); } function setupAutocomplete(inID, inURL) { var myTB = $("[id$='_" + inID + "']"); // change redcomplete to autocomplete to get rid of message handling myTB.redcomplete({ source: function(request, response) { $.ajax({ url: inURL, data: "{'filter': '" + request.term + "'}", success: function(data) { response($.map(data, function(item) { return { label: item.text, value: item.id, // remove this line and the , above to get rid of message handling message: item.message }; })); } }) }, delay: 500, minLength: 3, focus: function(event, ui) { myTB.val(ui.item.label); return false; }, select: function(event, ui) { // action for the select here. return false; }, open: function() { $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); }, close: function() { $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); } });