onClientClick返回Function（）仍会触发OnClick

Question

Trying to prevent my Button1_Click from submitting my data after testing if its valid in javascript. Have tried a bunch of times but it submits regardless of what I return in the function.

<form runat="server">
<asp:Button ID="Button1" runat="server" Text="Submit" OnClick="Button1_Click" OnClientClick="return testValidate();" />
</form>

Button1_Click is ac# function that currently only alerts me if it is called - Edit

My Javascript function:

function testValidate() { 
return false;
}

I have tried a few proposed solutions such as using OnClientClick="if (!testValidate()) return
false;"

However none of these have worked

Thanx for the help in advance

Answer 1

It is hard to understand what you really are looking for, but if you do not want your form data to be submitted when validation fails then you would need to convert it all to JavaScript and setup an ajax call (this would require removing the OnClick event), or do all your validation in the C# code function, which you could then use a bool to determine whether or not to submit the data.

A JavaScript example:

function testValidate() { 
    var is_valid = false;
    // Do validation code
    if(is_valid) {
        $..ajax({
           url: //URL location of your webservice,
           method: 'POST',
           contentType: "application/json; charset=utf-8",
           dataType: 'json',
           data: //Form data,
           success: function (data) {

           },
           error: function (data, text, error) {
              alert(error);
           }
        });
     }
}

The web service method

[WebMethod]
public void SubmitData(/*Lay out all parameters here*/) 
{
     //Insert form data
}

Doing it all in the OnClick. (Requires removing the OnClientClick as it will no longer be needed)

Front side:

<form runat="server">
    <asp:Button ID="Button1" runat="server" Text="Submit" OnClick="Button1_Click" />
</form>

C#:

protected void Button1_Click(object sender, EventArgs e) 
{
     bool isValid = false;
     // Do validation
     if(isValid)
     {
         // submit form data
     }
}

I apologize in advance if I misunderstand what you are looking for and I am willing to revise my answer if what I am giving now is incorrect for your needs. If it is not what you are looking for please clarify your question. Thanks!

EDIT:

Here is why OnClientClick="return false;" and OnClientClick="return testValidate();" are different.

JS will return the second it sees a return statement, regardless of whether or not the code is finished executing. So return testValidate(); executes a function call and returns immediately not giving testValidate() a chance to finish running where as return false; returns false immediately.

To avoid returning immediately try just using OnClientClick="var test = testValidate(); setTimeout(function() { return test; }, 10);" . Or you can put inside the timeout time limit (the 10 in this example) any amount of time in milliseconds to allow for the return to only happen once the function is done and test has a value. Or you can just do OnClientClick="testValidate();" which will evaluate testValidate() as a boolean after it has called it which will allow the return false; in your function to be called and false to be returned. I hope that makes more sense.

Answer 2

instead of

OnClientClick="return testValidate();"

just write

OnClientClick="testValidate();"