Здравствуйте!
У меня есть форма поиска с выпадающим списком.
Т.е. пользователь вводит в поле свой запрос и в выпадающем списке выбирает где искать его запрос.
Моя форма:
<section class="container-search">
<form class="search-new" action="" >
<input id ="my-search" class="new-search" type="search" name="query" placeholder="Поиск" autocomplete="off" required/>
<ul class="search-ac">
<li><a class="country" id="ru" href="/ru/search"><img src="/app/site/assets/img/russia.png" alt="Россия">Россия</a></li>
<li><a class="country" id="ua" href="/ua/search"><img src="/app/site/assets/img/ukraine.png" alt="Украина">Украина</a></li>
<li><a class="country" id="kz" href="/kz/search"><img src="/app/site/assets/img/kazakhstan.png" alt="Казахстан">Казахстан</a></li>
</ul>
</form>
</section>
По т.е. допустим пользователь решил поискать "береза" в России. По тегу <a> пользователь переходит по ссылке /ru/search, а мне нужно, чтобы он переходил по ссылке /ru/search?query=береза.
Для этого я написала скрипт.
$(document).ready(function() {
/*Получаю id страны при собитии click*/
function cnt() {
$('a.country').click(function() {
var country = $(this).attr('id');
return country;
});
}
// результат функции записываю в переменную
var c = cnt();
//получаю результат ввода в input
function vln() {
$("input#my-search").keyup(function() {
var value = $(this).val();
}).keyup();
return value;
}
// результат функции записываю в переменную
var v = vln();
//формирую новые url
var url = "http://dev.com/" + c + "?query=" + v;
//Переопределяю href для ссылки
$("a.country").attr("href", url);
});
Но к решению задачи не продвинулась. Помогите, пожалуйста, советом, комментарий, примером.
То, что я совсем новичoк в js, думаю очевидно.
Заранее спасибо!