Получить значение id в отдельное поле

@Mothur · Регистрация: 29.05.2014

Студворк — интернет-сервис помощи студентам

Доброго времени суток.

нашёл живой ajax поиск достаточно простой и лёгко настраиваемый (для меня, как не знатока java script) - ссылка.

живой поиск

index.html

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="content-type" content="text/html">
    <meta charset="utf-8">
    <title>Поиск</title>
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="js/search.js"></script>
    <link href="style.css" rel="stylesheet" type="text/css">
</head>
 
<body>
 
    <input type="text" name="referal" placeholder="Введите фамилию" value="" class="who"  autocomplete="off">
    <ul class="search_result"></ul>
 
</body>
</html>

style.css

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
.search{
    position:relative;
}
 
.search_result{
    background: #FFF;
    border: 1px #ccc solid;
    width: 350px;
    border-radius: 4px;
    max-height:100px;
    overflow-y:scroll;
    display:none;
}
 
.search_result li{
    list-style: none;
    padding: 5px 10px;
    margin: 0 0 0 -40px;
    color: #0896D3;
    border-bottom: 1px #ccc solid;
    cursor: pointer;
    transition:0.3s;
}
 
.search_result li:hover{
    background: #F9FF00;
}

search.php

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php
 
define("DB_HOST","localhost");
define("DB_NAME","rtss"); //Имя базы
define("DB_USER","rtss"); //Пользователь
define("DB_PASSWORD","12345"); //Пароль
 
$mysqli = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);
$mysqli -> query("SET NAMES 'utf8'") or die ("Ошибка соединения с базой!");
 
if(!empty($_POST["referal"])){ //Принимаем данные
 
    $referal = trim(strip_tags(stripcslashes(htmlspecialchars($_POST["referal"]))));
 
    $db_referal = $mysqli -> query("SELECT * from passport WHERE surname LIKE '%$referal%'")
    or die('Ошибка №'.__LINE__.'<br>Обратитесь к администратору сайта пожалуйста, сообщив номер ошибки.');
 
    while ($row = $db_referal -> fetch_array()) {
        echo "\n<li>".$row["surname"].' '.$row["name"].' '.$row["middle_name"].' ('.$row["birth_year"].')';"</li>";
    }
}
?>

search.js

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
$(function(){
    
    //Живой поиск
    $('.who').bind("change keyup input click", function() {
        if(this.value.length >= 2){
            $.ajax({
                type: 'post',
                url: "search.php", //Путь к обработчику
                data: {'referal':this.value},
                response: 'text',
                success: function(data){
                    $(".search_result").html(data).fadeIn(); //Выводим полученые данные в списке
                }
            })
        }
    })
    
    $(".search_result").hover(function(){
        $(".who").blur(); //Убираем фокус с input
    })
    
    //При выборе результата поиска, прячем список и заносим выбранный результат в input
    $(".search_result").on("click", "li", function(){
        s_user = $(this).text();
        $(".who").val(s_user); //деактивируем input, если нужно
        $(".search_result").fadeOut();
    })
})

Настроил под себя, чтобы искал в базе по фамилии и выводил в выпадающем списке ФИО+год.

В файле search.js есть строчка кода, которая помещает в поле поиска выбранный результат:

JavaScript
1
2
3
4
5
6
//При выборе результата поиска, прячем список и заносим выбранный результат в input
    $(".search_result").on("click", "li", function(){
        s_user = $(this).text();
        $(".who").val(s_user);
        $(".search_result").fadeOut();
    })

конкретно $(".who").val(s_user); - помещаем в поле с class=who значения переменной s_user. А в эту переменную перед этим заносим весь выбранный текст из выпадающего списка (списка поиска).

Проблема вот в чём - скажите, пожалуйста, как заносить в переменную s_user не весь текст из выпадающего списка, пункт которого мы выбрали. А только какое-то одно значение.
Например, в списке предлагают Семён Семёнов Семёнович (20,04,1990г)
А при выборе заносится в строчку только Семён.

Вообще, мне нужно получить id выбранной записи. Но если пойму, как заносить только одно что-то, то смогу и это.

Помогите, пожалуйста!!!!

@BANO · 18.08.2015, 15:01

Сообщение от Mothur

Например, в списке предлагают Семён Семёнов Семёнович (20,04,1990г)
А при выборе заносится в строчку только Семён.

JavaScript
1
2
3
4
5
6
//При выборе результата поиска, прячем список и заносим выбранный результат в input
    $(".search_result").on("click", "li", function(){
        s_user = $(this).text().match(/^w+/i)[0];// это кривой способ, тупо выбирает первое попавшееся слово
        $(".who").val(s_user);
        $(".search_result").fadeOut();
    })

@Mothur · 18.08.2015, 15:26 **[ТС]**

BANO,
не работает...=( Ничего не заносится в поле. Ноль реакции.

@BANO · 18.08.2015, 15:34

Mothur, консоль молчит?

@Mothur · 18.08.2015, 15:49 **[ТС]**

BANO,
консоль?
я же в браузере запускаю. Просто значение не заносится в строку. Ошибок никаких не выбивает на экране.

@BANO · 18.08.2015, 15:55

Mothur, всё понятно, ты точно новичок

нажми f12
зайди в консоль(это вкладочка такая) и скажи, что там написано

@Mothur · 18.08.2015, 15:58 **[ТС]**

BANO,
при попытке нажать на вариант поиска - Uncaught TypeError: Cannot read property '0' of null

@BANO · 18.08.2015, 16:03

Mothur, теперь понятно
я лоханулся
вот это /^w+/i замените на это /^\w+/i

Добавлено через 1 минуту
но кстати если поле будет пустым, то ошибка тоже будет, так-что лучше сделать "защиту от дурака"

@Mothur · 18.08.2015, 16:06 **[ТС]**

BANO,

всё та же ошибка... (Uncaught TypeError: Cannot read property '0' of null)

скриншот -

@BANO · 18.08.2015, 16:13

странно, у меня в консоли всё работает,
а строка пустая? ну то есть значение инпута из которого мы берём

@BANO · 18.08.2015, 16:16

да не пустая,
проблема, только не понятно какая

вы можете этот проект в какой-нибудь пеочнице скинуть?

ps надо скидывать картинки на форум, а не на файло-обменник

@BANO · 18.08.2015, 16:22

хорошо, попробуем так

JavaScript
1
2
3
4
5
6
7
8
//При выборе результата поиска, прячем список и заносим выбранный результат в input
    $(".search_result").on("click", "li", function(){
        console.log(this)
        s_user = $(this).text()//.match(/^w+/i)[0];// это кривой способ, тупо выбирает первое попавшееся слово
        console.log(s_user)
        $(".who").val(s_user);
        $(".search_result").fadeOut();
    })

b скиньте мне скриншот того, что вылетело в консоль

@Mothur · 18.08.2015, 16:31 **[ТС]**

BANO,

пеочницу?

Live.zip

Про фото понял)

@Mothur · 18.08.2015, 16:36 **[ТС]**

BANO,

Вот. Значение полностью занеслось в input

@BANO · 18.08.2015, 17:02

а теперь попробуйте так

JavaScript
1
2
3
4
5
6
7
8
//При выборе результата поиска, прячем список и заносим выбранный результат в input
    $(".search_result").on("click", "li", function(){
        console.log(this)
        s_user = $(this).text()//.match(/^\w+/i)[0];// это кривой способ, тупо выбирает первое попавшееся слово
        console.log(s_user.match(/^\w+/))
        $(".who").val(s_user);
        $(".search_result").fadeOut();
    })

Добавлено через 36 секунд
что-то у меня тоже засада
просто так в консоли он нормально работает, а как только в коде ну нии как не хочет

@Mothur · 18.08.2015, 17:07 **[ТС]**

BANO,

нет(

@BANO · 18.08.2015, 17:14

я нашёл ошибку

короче я тебе if скину робящую

JavaScript
1
2
3
4
5
    $(".search_result").bind("click", "li", function(){
        s_user = $(this).text().trim().match(/^[^\s]+/i)[0];
        $(".who").val(s_user); //деактивируем input, если нужно
        $(".search_result").fadeOut();
    })

он там искал только английские буквы, а теперь все буквы

Добавлено через 1 минуту
и у тебя были правильные срабатывания, только они в консоль уходили, а не в инпут

@Mothur · 18.08.2015, 17:29 **[ТС]**

BANO,

работает, да))

Спасибо большое)

Скажите, как лучше сделать:
1) в выпадающем меню выводить перед ФИО номер id. И при клике номер этот заносить в поле. Дальше отысылать этот id обруботчику, который запишет информацию в базу. И после опять вернуться к добавлению человека.
Это заполнение участников похода
2) также в выпадающем меню выводить перед ФИО номер id. Но при клике заносить его в массив. Как-то сразу же отображать содержимое массива (чтобы лишнего не нащёлкать). И после отправить данные обработчику, который в цикле переберёт массив.
3) или что-то ещё.

Как быть?

@BANO · 18.08.2015, 17:40

Mothur, лучше с массивом, меньше лишних движений юзеру
а вообще-то можно сделать, чтобы искались несколько ид, то есть "мултипоиск", тогда мы отправляем обработчику(а это ваш search.php) строчку, а он её уже пусть разбирает сам, по каким-то параметрам, ну можно разделителям, короче как в мейле сделано)

@Mothur · 18.08.2015, 17:46 **[ТС]**

BANO,
второе вряд ли осилю...

а как в java из поля определённого данные в массив записать?

Новые блоги и статьи Все статьи Все блоги /
Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .	Изучаю kubernetes lagorue 13.01.2026 А пригодятся-ли мне знания kubernetes в России?	Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/	WordPad для Windows 11 Jel 10.01.2026 WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11 Jel 10.01.2026 Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .	Почему дизайн решает? Neotwalker 09.01.2026 В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .	Модель микоризы: классовый агентный подход 3 anaschu 06.01.2026 aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114	Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ФедосеевПавел 06.01.2026 Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 15:26 [ТС]
	BANO, не работает...=( Ничего не заносится в поле. Ноль реакции. 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.08.2015, 15:34
	Mothur, консоль молчит? 1

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 15:49 [ТС]
	BANO, консоль? я же в браузере запускаю. Просто значение не заносится в строку. Ошибок никаких не выбивает на экране. 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.08.2015, 15:55
	Mothur, всё понятно, ты точно новичок нажми f12 зайди в консоль(это вкладочка такая) и скажи, что там написано 1

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 15:58 [ТС]
	BANO, при попытке нажать на вариант поиска - Uncaught TypeError: Cannot read property '0' of null 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.08.2015, 16:03
	Mothur, теперь понятно я лоханулся вот это /^w+/i замените на это /^\w+/i Добавлено через 1 минуту но кстати если поле будет пустым, то ошибка тоже будет, так-что лучше сделать "защиту от дурака" 1

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 16:06 [ТС]
	BANO, всё та же ошибка... (Uncaught TypeError: Cannot read property '0' of null) скриншот - 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.08.2015, 16:13
	странно, у меня в консоли всё работает, а строка пустая? ну то есть значение инпута из которого мы берём 1

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.08.2015, 16:16
	да не пустая, проблема, только не понятно какая вы можете этот проект в какой-нибудь пеочнице скинуть? ps надо скидывать картинки на форум, а не на файло-обменник Миниатюры 1

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 16:31 [ТС]
	BANO, пеочницу? Live.zip Про фото понял) 0

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 16:36 [ТС]
	BANO, Вот. Значение полностью занеслось в input 0

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 17:07 [ТС]
	BANO, нет( 0

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 17:29 [ТС]
	BANO, работает, да)) Спасибо большое) Скажите, как лучше сделать: 1) в выпадающем меню выводить перед ФИО номер id. И при клике номер этот заносить в поле. Дальше отысылать этот id обруботчику, который запишет информацию в базу. И после опять вернуться к добавлению человека. Это заполнение участников похода 2) также в выпадающем меню выводить перед ФИО номер id. Но при клике заносить его в массив. Как-то сразу же отображать содержимое массива (чтобы лишнего не нащёлкать). И после отправить данные обработчику, который в цикле переберёт массив. 3) или что-то ещё. Как быть? 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.08.2015, 17:40
	Mothur, лучше с массивом, меньше лишних движений юзеру а вообще-то можно сделать, чтобы искались несколько ид, то есть "мултипоиск", тогда мы отправляем обработчику(а это ваш search.php) строчку, а он её уже пусть разбирает сам, по каким-то параметрам, ну можно разделителям, короче как в мейле сделано) 1

@Mothur 33 / 4 / 1 Регистрация: 29.05.2014 Сообщений: 144
	18.08.2015, 17:46 [ТС]
	BANO, второе вряд ли осилю... а как в java из поля определённого данные в массив записать? 0