Validation Before Postback Event on Masterpage Asp.net

Question

Hi all,

I was wondering if anyone knew of a way to do some client side validation with jquery and then run the postback event manually for a asp.net control?

Here's a sample Master page i.e.

<script type="text/javascript">
 $(document).ready(function() {
     $("#<%=lnkbtnSave.ClientID %>").click(function() {
        alert("hello");
        // Do some validation
        // If validation Passes then post back to lnkbtnSave_Click Server side Event
        });
});
</script>
<asp:LinkButton ID="lnkbtnSave" runat="server" onclick="lnkbtnSave_Click"  ><asp:Image   ID="Image3" runat="server" ImageUrl="~/images/save.gif" AlternateText="Save" />Save</asp:LinkButton>

Master Page Code Behind

    public delegate void MasterPageMenuClickHandler(object sender, System.EventArgs e);
    public event MasterPageMenuClickHandler MenuButton;

    protected void lnkbtnSave_Click(object sender, EventArgs e)
    {
        // Assign value to public property
        _currentButton = "Save";

        // Fire event to existing delegates
        OnMenuButton(e);
    }

    protected virtual void OnMenuButton(EventArgs e)
    {
        if (MenuButton != null)
        {
            //Invokes the delegates.
            MenuButton(this, e);
        }
    }

Content Page Code behind

protected void Page_Load(object sender, EventArgs e)
{
        Master.MenuButton += new Form.MasterPageMenuClickHandler(Master_MenuButton);
}

void Master_MenuButton(object sender, EventArgs e)
    {
        switch (Master.CurrentButton)
        {
            case "Save":
                Save();
                break;
            case "New":
                Response.Redirect("ContentPage.aspx");
                break;
            default:
                break;
        }
    }

Also the control lnkbtnSave is in a master page so how would i determine which content page i'm on since each content page will have it's own controls to validate.

Thanks for any help

Answer 1

If you look at it in reverse it could be simplified. Instead of doing validation and then initiating the postback, you could validate and prevent the postback if needed.

$('#<%= lnkbtnSave.ClientID %>').click(function(e) {
    if (!validate()) {
        e.preventDefault(); //will stop the page from posting back.
    }
});

If you really need to initiate the postback (and do it the other way) you could explicitly call the __doPostBack() function that ASP.NET puts on the page for you after doing your validation.

// This does the exact same thing as above, but it explicitly calls __doPostBack
// If you use the above code __doPostBack will be called automatically for you.
$('#<%= lnkbtnSave.ClientID %>').click(function(e) {
    if (validate()) {
        __doPostBack('<%= lnkbtnSave.ClientID %>','');
    }
    e.preventDefault();
});

Let me know if any of this needs clarification.

Answer 2

For the first question you should be able to just return true to cause the linkbutton to postback and return false to stop it.

$(document).ready(function() {     
   $("#<%=lnkbtnSave.ClientID %>").click(function() {        
      alert("hello");        
      var isValid = false;
      // Do some validation
      return isValid;
    });
 });

For your second question, you could have each page add their own version of the validation script, and have the function in the masterpage use it to determine validity:

Master Page:

$(document).ready(function() {     
   $("#<%=lnkbtnSave.ClientID %>").click(function() {                  
      return pageIsValid();
    });
 });

Content Page:

    function pageIsValid() {
       var isValid = false;
       //validation logic
       return isValid;
    }

Answer 3

You can just use a CustomValidator control and set it's ClientValidationFunction property.

Answer 4

Will this method work with DNN 4.x.x? I cannot seem to get it going.