Submit form in PHP using Hit Enter

Question

I am using an image instead of a submit button for search option and use onclick events to load the results using ajax in php.Now I need to load results by hit enter also.Is their any ways to update my application without changing the image .

Thanks

Answer 1

I don't know what javascript library you're using, but I'll use jQuery in my example.

<script>
$(document).ready(function() {
  $("form#interesting").bind("submit",function() {
    $.get("target_page.php".function() {
      // Callback functionality goes here.
    });
  });
});
</script>
<form id="interesting">
Enter your input: <input type="text" name="interesting_input" />
<!-- input type="image" is a way of using an image as a submit button -->
<input type="image" src="submit_button_image.gif" />
</form>

Answer 2

Sure, add <input type="submit" style="display:none;" /> <input type="submit" style="display:none;" /> to the end of your form, should trick the browsers into allowing the Enter key to submit your form.

As far as getting the same functionality as your AJAX onclick event: You should be tying your ajax function to the <form> 's submit event instead of the <input> 's click event.

jsfiddle demonstration (uses jQuery for ajax ease, but your event doesn't have to)

Answer 3

Hmm, There are several things I can think about.

fitst one - someone mentioned that you can style submit button as an image. Good idea and it's easy. this tutorial was posted as an answer some time ago http://www.ampsoft.net/webdesign-l/image-button.html .

Another problem is, you bind your submit event to onclick, but the natural submit for form is onsubmit. So if you hit enter on form input the form receives onsubmit event. You have to bind your JS to it.

It works genrally as in answer from @phleet when you use jquery, when you don't use any library, you can do something like

<form onsubmit="YOUR_JS_HERE">.....</form>

like in onclick. I also recommend using jQuery, though.