bala3569
bala3569

Reputation: 11000

How to call a clientside script function first and then call a server side button click event?

Here i am trying to do a email validation for a textbox using jquery and am calling that function on onclientclick and i have a button click event too.But the button click event is firing before the javascript function.I need to validate the textbox before firing the button click event.Here is my code

 $(document).ready(function () {
             $("#MainContent_txtEmail").blur(function () {
                ValidateEmail();
             });

             function ValidateEmail()
             {
              var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
                 var emailaddress = $("#MainContent_txtEmail").val();
                 if (!emailReg.test(emailaddress)) {

                     $("#emailspan").html('<font color="red" size=2px;>Please enter valid Email address</font>');
                     return false;
                 }
                 else {

                     $("#emailspan").html('<font color="red"></font>');
                     return true;
                 }
             }
         });

and

 <asp:TextBox ID="txtEmail" name="txtEmail" runat="server" CausesValidation="false" TextMode="Email">
            </asp:TextBox><span id="emailspan" value="0"></span>
            <asp:Button ID="btnsubmit" CssClass="btn pdf-submit" runat="server" Text="SEND"  OnClientClick="return ValidateEmail();" OnClick="btnsubmit_Click"/>

and my event

  protected void btnsubmit_Click(object sender, EventArgs e)
        {

            SendSmtpEmail(txtEmail.Text, "[email protected]", "test", "test-template");
        }

Any suggestion??

Upvotes: 1

Views: 3933

Answers (4)

Sanket
Sanket

Reputation: 286

hey In your code ::

`$("#MainContent_txtEmail").blur(function () 

why you are calling the function you may have to change that in to

$("#txtEmail").blur(function ()` 

this will work I guess !!

Upvotes: 2

Valentin S.
Valentin S.

Reputation: 504

The ValidateEmail() method is not visible being declared inside the anonymous method passed as argument to the $.ready() method.

Get the ValidateEmail method outside $(document).ready and it should work.

Upvotes: 0

Tom Maton
Tom Maton

Reputation: 1594

Why use javascript? Just use the asp.net RegularExpressionValidator like so:

<asp:RegularExpressionValidator ID="regexEmailValid" runat="server" ValidationExpression="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ControlToValidate="tbEmail" ErrorMessage="Invalid Email Format"></asp:RegularExpressionValidator>

More info here http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.regularexpressionvalidator.aspx

Upvotes: 1

Jono
Jono

Reputation: 4076

You'll want to remove the OnClick for btnsubmit

<asp:Button ID="btnsubmit" CssClass="btn pdf-submit" runat="server" Text="SEND"  OnClientClick="return ValidateEmailThenSubmit();" />

Then click the btnsubmit manually in code after the validation.

function ValidateEmailThenSubmit()
{
    ValidateEmail();
    $("#" + <%= btnsubmit.ClientID %>).click();
}

Upvotes: 1

Related Questions