Clickable автозаполнения, как Google

Question

Я ищу для автозаполнения, которые не имеют кнопку «отправить», но когда пользователь нажимает на автозаполнения ключевое слово, он будет перенаправлен на другой адрес, то я выберу

я использую http://dyve.net/jquery/?autocomplete и я хотел бы реализовать в этом сценарии, а не использовать какой-либо другой (потому что, если я типа ОДУ в этом, он показывает КОД, а также ОДЕССА)

пример:

пользователь типа „липкое“ затем появляется GOOGLE для него, когда он нажимает на GOOGLE, сценарий отправляет его на www.google.com (например, «Google» => «http://www.google.com»)

было бы здорово, если бы я мог бы просто сделать с помощью сценария я сказал вам, ребята я не программист, так что мне нужно, как, сам код, я знаю, его слишком много, чтобы спросить, но я попробовал все = \

спасибо!

---

проблема в Жуй автозаполнения является то, что я хочу сделать это:

если я типа «ОДУ»

было бы показать «C ОДУ», а также "ОДА SSA "

не только с самого начала, вот почему я пытаюсь использовать ваш код в этом другом

также, когда я использовал код Расса и karim79, он не работал

Answer 1

«но даже автор не знает, как сделать это» ??

Я думаю, что это легко сделать, заменив предупреждение в виде сообщения (в example page) вызовом form.submit(). Однако я не пробовал.

Edit: Вот несколько примеров кода с помощью http://dyve.net/jquery/?autocomplete:

$("#mytextbox").autocomplete("form.php", {onItemSelect:submitTheForm}); 

function submitTheForm(){ 
    // redirect user to whatever URL 
} 

Answer 2

Вот complete walkthrough on how to build an autocomplete search.

По существу, вы должны иметь обработчик события для вызова

window.location.href = "your-url-string.com"; 

при прессовании войти или нажав на выбор.

EDIT:

С autocomplete documentation

Поиск Страница Замена

автозавершения плагин может быть использован для поиска на срок и перенаправлять на страницы, связанной с результирующий элемент. Ниже один из способов достижения редирект:

var data = [ {text:'Link A', url:'/page1'}, {text:'Link B', url: '/page2'} ]; 
$("...").autocomplete(data, { 
    formatItem: function(item) { 
    return item.text; 
    } 
}).result(function(event, item) { 
    location.href = item.url; // navigate to the chosen URL 
}); 

Answer 3

Я реализовал что-то подобное, однако, моя реализация использует jQuery UI Autocomplete.

Я использую простой трюк, в результате чего данные, возвращаемые с сервера представляет собой набор строк, разделенных символом новой строки «\ п», в каждой строке есть строка с форматом внушения :: URL. На клиенте я просто разбиваю на разделитель (я использую ::) и извлекаю предложение из первого смещения результирующего массива, а URL из второго. Пример:

$("#search").autocomplete("/some/page", { 
     selectFirst: false, 
     formatItem: function(data, i, n, value) { 
      //make the suggestion look nice 
      return "<font color='#3399CC'>" + value.split("::")[0] + "</font>"; 
     }, 
     formatResult: function(data,value) { 
      //only show the suggestions and not the URLs in the list 
      return value.split("::")[0]; 
     } 
    }).result(function(event, data, formatted) { 
     //redirect to the URL in the string 
     var pieces = formatted.split("::"); 
     window.location.href = pieces[1]; 
    }); 

Чтобы уточнить, что я имею в виду, предположим, что вы набираете 'goo'. Сервер может вернуться:

google::www.google.com\ngoodstuff::www.example.com 

Этот пользователь увидит, что список появился с «google» и «goodstuff». При нажатии на один из них будет выполнен метод Autocomplete result, где я просто беру URL-часть строки и перенаправляю. Надеюсь, это поможет.

Answer 4

плагин jQuery Autocomplete имеет параметр matchContains, который будет искать результат. Установите значение true, и оно также вернет совпадения подстроки.

Answer 5

следующий код работает отлично для меня для токарной окно поиска с данными на удаленном источнике данных (базы данных MySQL) в поле поиска и редиректор, если пользователь выбирает один из предложенных результатов:

$("#search").autocomplete("search.php", { 
    width: 260, 
    formatItem: function(data) { 
      return data[0]; 
      } 
     }).result(function(event, data) { 
    window.location.href = data[1]; 
}); 

примечания: я должен был сделать Аякс данных, разделенные на две части:

1. термин поиска
2. URL-адрес, связанный с этим термином

например.

Brad Pitt |/актеры/bradpitt

Matt Damon |/актеры/Деймон

JQuery автозаполнения автоматически разделяет данные на трубе (|) и на новой линии

Answer 6

простейшего примера можно найти на JSFiddle

var data = [ 
    { 
     value: 'Google', 
     url: 'http://www.google.com' 
    }, 
    { 
     value: 'StackOverflow', 
     url: 'http://www.stackoverflow.com' 
    } 
]; 

$("input").autocomplete({ 
    source: data, 
    select: function(event, ui) { 
     window.location = ui.item.url; 
    } 
});