Twitter Typeahead Press Enter Key Go To Search Page Example

Apr 17, 2021



Twitter Typeahead Press Enter Key Go To Search Page Example

Now let's see example of press enter on search input box using twitter typehead. When i was working with Twitter typeahead auto-complete on my laravel 8 application, But when i press enter key, it's not redirect on my result page. I want to redirect on my result page that way i can display all records of matching search text.

I did try to solve many way but i can't solve simply. At last i found way using jquery "on keypress" event. You can see bellow code how it is work. So let's see bellow example:

In this example when you press enter on search input box. it will redirect on search page like bellow path:



<!DOCTYPE html>



<title>Twitter typeahead press enter key go to search page -</title>

<script src=""></script>

<script src=""></script>

<script src=""></script>



<input type="text" class="typeahead" />

<script type="text/javascript">

var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California','Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii'];

var states = new Bloodhound({

datumTokenizer: Bloodhound.tokenizers.whitespace,

queryTokenizer: Bloodhound.tokenizers.whitespace,

local: states



hint: true,

highlight: true,

minLength: 1



name: 'states',

source: states

}).on('keypress', function(e) {

if (e.which == 13) {

var q = $('').val();

window.location.href = "/search?q="+q;






It will help you....