Jquery submit form broken

Question

I tried stop form refreshing the page but it refreshes page every time i submit the form.

Answer 1

You need to put your code in the jQuery ready handler.

<script>
$(function(){
  $("#myforms").submit(function() {
              return false;
        });
});
</script>

Answer 2

Move the script tag to after the form or add the code to a domready event.

<form action="" method="post" id="myforms">
      <input id="search123" style="text-align:center" type="text" value="Enter Search..." />
</form>
<script>
    $("#myforms").submit(function() {
        return false;
    });
</script>

FIDDLE

<script>
    $(document).ready(function(){
        $("#myforms").submit(function() {
            return false;
        });
    });
</script>

FIDDLE

Answer 3

You need to use ajax if you don't want to refresh the page.

Answer 4

This is a common problem, and is easily solved.

Just get rid of the <form> tags and instead use:

<div id="myforms">
    <input id="search123" onKeyUp="setTimeout(submit,1000)" style="text-align:center" type="text" value="Enter Search..." />
</div>

Then create a submit() method in Javascript that performs the desired operations.

This stops the form from posting back to the page.

If you need to POST the data somewhere, use JQuery's .post() method in the submit() method:

http://api.jquery.com/jQuery.post/

Answer 5

A submitted form will always refresh/redirect the page, to avoid it all you have to do is:

<form action="" method="post" id="myforms" onsubmit="return false">
      <input id="search123" style="text-align:center" type="text" value="Enter Search..." />
</form>​​​​​​​​​​​​​

returning false on the submit handler will prevent the form from submitting, and the page from refreshing, and there really is no need for jQuery just to prevent a form!

To both send the form to the server and not have the page refresh will however require the use of Ajax, and jQuery has some great ajax functionality built in, but it looks like you need to read up a little on the jQuery website.

Answer 6

You forgot some paranthesis:

$("#myforms").submit(function() {
        return false;
  });