Return False Never Works For me With Jquery Submit? What am I doing wrong?

Question

Hi

I am trying to stop my form from submitting yet I never can get it work and always end up changing it to a button type. However I want to see if I keep the submit button as is if I can have in my Asp.net mvc application as a FormCollection Paramater.

Yet I can't even try really passing in anything until I get it to stop submitting. I don't know why I can't get it work

View

$(function()
{
    $("#Submit1").submit(function(e)
    {
        $.post("Page1", function(e)
        {
            alert("alert");
        });

        return false;

    });

});


<% using (Html.BeginForm("Page1","Home",FormMethod.Post,new {@id = "mytest" }))

   { %>
      <%= Html.TextBox("test","hi") %>
      <input id="Submit1" type="submit" value="submit" />
 <% } %>

Controller Method

public bool Page1()
{
    return false;
}

Answer 1

You need to put the submit on the form, not on the input node.

 $("#mytest").submit(function(e) {
    ...
 }

Answer 2

I think you want

$("#mytest").submit(function(e)

Answer 3

The submit() method should be attached to the form not the submit button. Like this:

$("#mytest").submit(function(e) ....

Answer 4

You can always use preventDefault() on the event:

$("#submit-btn").click(function(e){
    e.preventDefault();
    ....
    if (validations pass)
        $("#theform").submit();
});