За последние 24 часа нас посетили 20345 программистов и 1012 роботов. Сейчас ищет 371 программист ...

Живой поиск в больше чем один input

Тема в разделе "PHP для новичков", создана пользователем l_2001, 1 июл 2022.

  1. l_2001

    l_2001 Активный пользователь

    С нами с:
    9 дек 2014
    Сообщения:
    59
    Симпатии:
    2
    Есть живой поиск на js+php.
    Код (Javascript):
    1. $(function(){
    2.     //Живой поиск
    3.     $('.who').bind("change keyup input click", function() {
    4.         if(this.value.length >= 2){
    5.             $.ajax({
    6.                 type: 'post',
    7.                 url: "search.php", //Путь к обработчику
    8.                 data: {'who':this.value},
    9.                 response: 'text',
    10.                 success: function(data){
    11.                     $(".search_result").html(data).fadeIn(); //Выводим полученые данные в списке
    12.                 }
    13.             })
    14.         }
    15.     })
    16.  
    17.     $(".search_result").hover(function(){
    18.         $(".who").blur(); //Убираем фокус с input
    19.     })
    20.     //При выборе результата поиска, прячем список и заносим выбранный результат в input
    21.     $(".search_result").on("click", "li", function(){
    22.         s_user = $(this).text();
    23.         $(".who").val(s_user).attr('enabled', 'enabled'); //деактивируем input, если нужно
    24.         $(".search_result").fadeOut();
    25.     })
    26. })
    Если input один, то заполнение нормальное, а если два или больше, то в полях вывод синхронный, что и понятно
    PHP:
    1. while ($arr = sql_fetch_assoc($q)) {
    2.             $innerHTML .= '<td><input style="font-size: 12px; width: 100%; color: black" type="text" id="who" name="who" placeholder="' . $who . '" value="' . $who . '" class="who" autocomplete="off"><ul class="search_result"></ul></td>';
    3.             $innerHTML .= '<td><button style="background-color: coral; font-size: 12px" type="submit" name="Save" value="' . $did . '">Сохраним?</form></td></tr>';
    4.         }
    А можно-ли как-то сделать так, чтобы заполнялся input только одной выбранной строки, а не двух или трёх? Заранее спасибо!
     
  2. ADSoft

    ADSoft Старожил

    С нами с:
    12 мар 2007
    Сообщения:
    3.822
    Симпатии:
    736
    Адрес:
    Татарстан
    да потому что результат отдаете по классу- коих элементов у вас много... а надо только в тот - для которого было вызвано событие
    как-то так
    Код (Javascript):
    1. $('.who').bind("change keyup input click", function() {
    2.         if(this.value.length >= 2){
    3.         var el = $(this);
    4.             $.ajax({
    5.                 type: 'post',
    6.                 url: "search.php", //Путь к обработчику
    7.                 data: {'who':this.value},
    8.                 response: 'text',
    9.                 success: function(data){
    10.                     el.children(".search_result").html(data).fadeIn(); // или какой там правильный путь DOM вс одной строчки трудно прочесть
    11.                 }
    12.             })
    13.         }
    14.     })
     
  3. l_2001

    l_2001 Активный пользователь

    С нами с:
    9 дек 2014
    Сообщения:
    59
    Симпатии:
    2
    Спасибо! Но... Не получилось...! Явно не хватает знаний... Всё равно заталкивает вывод в два (и больше) input...
    PHP:
    1. $innerHTML .= '<td><input type="text" id="bywho" name="bywho" placeholder="' . $who . '" value="' . $who . '" class="who" autocomplete="off"><ul class="search_result"></ul></td>';
    Может быть нужно указывать что-то конкретно в коде input?