CODEWITHSUNDEEP
javascriptjqueryhtmlinput
gwar9
gwar9

Reputation: 1082

Enter key does not work in search box

Tried to search for this guys sorry. Input in the search box doesnt work (or search) when you hit enter only when the user clicks the search button. What am I doing wrong? Here is my code. Thanks. 

<script type="text/javascript">
  $(document).ready(function() {
    $("#submit").click(function() {
        var url = "http://asla.org/awardssearch.html";
        url += "?s=" + $('#GoogleCSE').val();
        window.location = url;
    });
    $('#GoogleCSE').keydown(function(event) {
        if (event.keyCode == '13') {
            $("#submit").click();
            }
        else {
            //do nothing :)
        }
    });

});
</script>

<form class="navbar-form navbar-right" role="search">
      <div class="search">
        <input id="GoogleCSE" type="text" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" value="Search All Awards" name="Search All Awards" />
        <input id="submit" type="button" value="Search" />
      </div>
</form>

Upvotes: 1

Views: 4333

Answers (2)

James Donnelly
James Donnelly

Reputation: 128771

If you changed your #submit element's type to "submit", you wouldn't need to manually handle this yourself anyway as this is default browser behaviour:

<input id="submit" type="submit" value="Search" />

Now rather than handling the #submit button's click event, we can instead handle the form element's submit event:

$('form[role="search"]').submit(function() {

    var url = "http://asla.org/awardssearch.html";
    url += "?s=" + $('#GoogleCSE').val();
    window.location = url;

});

JSFiddle demo.

Upvotes: 3

Florian Gl
Florian Gl

Reputation: 6014

Through $("#submit").click() you're just triggering the click handlers added by yourself, not the controls default behavior when you click on it.

Use yourForm.submit() instead and change the url in its callback:

$("#yourForm").submit(function() {
    var url = "http://asla.org/awardssearch.html";
    url += "?s=" + $('#GoogleCSE').val();
    window.location = url;
});

Upvotes: 1

Related Questions