-1

So, this is my form... it is not surrounded by <form></form> tags.

<input id="query" name="query" style="font-size: 18pt" id="text" data-email="required" type="text" placeholder="Search Here from <?php echo $row['no']."+"; ?> ..." class="extra-big-input border-none">
<div class="input-group-btn">
    <button onclick="search()" href="#result-modal" class="btn btn-large bg-white text-medium-gray btn-rounded btn-dark-gray popup-with-zoom-anim wow" data-wow-delay="0.6s"><i class="ti-search icon-small tz-icon-color no-margin position-raltive top-2"></i> Search</button>
</div>

on clicking the button the search() is called

<script>
        function search()
        {
            document.getElementById('queryresult').innerHTML = "<img src='images/loading.svg'>";
            var query=document.getElementById('query').value;
            $.ajax({
            method: 'POST',
            url: 'results.php',
            data: {
                query: query
            },
            success: function(data) {
                document.getElementById('queryresult').innerHTML = data;
            }
            })
        }
    </script>

here, is my question... How can i change this code so the search() can also be called on pressing Enter Key.??

Note:-

the function should not be called if query input is empty [no good in calling it for an empty query]

clicking the button also shows up the modal[where result is shown] so how can i call search() and also shows up the modal on pressing of enter key??

user9718255
  • 1
  • Put it in a form and use form submit event. If a submit button exists in form when you hit enter browser submits form by default. Just prvent the form submit event and do what you need – charlietfl Apr 29 '18 at 18:08

1 Answers1

0

Try this:

window.onkeyup = function(e) {
search()
console.log(e)
}

Then if you want just some certain key to perform the search use e.keyCode

Tiago Machado
  • 170
  • 3
  • 11