0

Автокомплит по городам.
Вот нарыл на просторах и пытаюсь заточить. Поиск работает, выдает результат, но не могу понять, как сделать, чтобы при нажатии на блок (display_box) его значение передалось в поле input (#searchbox).

JS

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

$(".city").keyup(function() 
{
var searchbox = $(this).val();
var dataString = 'searchcity='+ searchbox;

if(searchbox=='')
{
}
else
{

$.ajax({
type: "POST",
url: "autocomplete/search.php",
data: dataString,
cache: false,
success: function(html)
{

$("#display").html(html).show();
}
});
}return false;    
});
});
</script>

CSS

#display
{
width:215px;
display:none;
float:right; margin-right:3px;
background:#CCC;
border-left:solid 1px #dedede;
border-right:solid 1px #dedede;
border-bottom:solid 1px #dedede;
overflow:hidden;
position:absolute;
z-index:999;
}

.display_box
{
margin-bottom:-1px;
padding-left:10px;
padding-top:7px;
border-top:solid 1px #dedede;
font-size:14px;
height:30px;height:40px;
}
.display_box a
{
color:#3b5998;
}
.display_box:hover, .display_box:hover a
{
background:#3b5998;
color:#FFFFFF;
}

.display_box:hover{
margin-bottom:-1px; 
padding-top:8px;
}

.display_box span
{
font-size:10px;
padding-bottom:2px;
}

HTML

<input type="text" placeholder="город" class="styler kom2 city" name="city" id="searchbox" autocomplete="off" />
<div id="display"></div>

PHP отправляет вот так:

 echo '<div class="display_box" align="left">'."\n".
iconv('utf-8', 'cp1251', $final_city.'<br/>'."\n".'<span>'.$region).'</span><br/>'."\n".'</div>'."\n\n";

1 ответ 1

1

Вот решение: http://jsfiddle.net/961cp6pk/1/

А вообще, мне кажется не очень хорошей идея играть здесь с кодировкой, будет правильней, если скрипт выдаст данные в нужном виде.
Единственное, т.к. элемент создан динамически, то надо использовать событие on.

$(document).on('click','.display_box', function(){

});

И ещё. Данные у вас там на две строки, а вы желаете их упихнуть в одну строку поля input. Не смущает? И данные лучше принимать в json, удобнее.

5
  • Да нет же :) Две строки это на вывод, в выпадающий список, а название города можно отправить отдельной переменной
    – Dikkiy
    12 янв 2015 в 12:36
  • Хотя я понял, о чем вы, хм...
    – Dikkiy
    12 янв 2015 в 12:39
  • Если ответ вас устраивает, не возражу за оценку.
    – hcuser
    12 янв 2015 в 14:16
  • Ваш код работает, у вас, а у меня нет :( Видимо, из-за того, что у меня генерируется несколько полей с одинаковым классом
    – Dikkiy
    12 янв 2015 в 14:40
  • Какие — несколько полей? Тащите сюда, посмотрим. Впрочем, посмотрите пример, может проблема уже решится: jsfiddle.net/961cp6pk/10
    – hcuser
    12 янв 2015 в 18:07

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.