Saturday, May 8, 2010

Reset values of all controls using ASP.NET 2.0 and JavaScript

A very common requirement that comes up when building a form with lot of fields is resetting the controls back to their original state. In this article, we will explore how to do this task using both ASP.NET and Javascript. I assume you know how to build web pages in asp.net 2.0. Using ASP.NET
Step 1: Drag and drop a few controls like textboxes, radio buttons, checkboxes etc. on to the form
Step 2:
Add a button to the form and rename its Text property as “Clear all controls using ASP.NET”.  Rename its id property to be “btnClearASP”.
Step 3:
Double click the button. In its click event, call a method that will clear the content of the controls on a Page.
protected void btnClearASP_Click(object sender, EventArgs  e)
    {
        ResetFormControlValues(this);
    }
Write code for this method
C#
private void ResetFormControlValues(Control parent)
    {
        foreach (Control c in parent.Controls)
        {
            if (c.Controls.Count > 0)
            {
                ResetFormControlValues(c);
            }
            else
            {
                switch(c.GetType().ToString())
                {
                    case "System.Web.UI.WebControls.TextBox":
                        ((TextBox)c).Text = "";
                        break;
                    case "System.Web.UI.WebControls.CheckBox":
                        ((CheckBox)c).Checked = false;
                        break;
                    case "System.Web.UI.WebControls.RadioButton":
                        ((RadioButton)c).Checked = false;
                        break;
                 
                }              
            }
        }
    }