RequiredField validator control in asp.net - Part 44

Suggested Videos
Part 41 - Literal control in asp.net
Part 42 - Asp.net panel control
Part 43 - Creating controls dynamically using asp.net panel control

Validation controls are used to ensure if, the data, entered by the user is valid. Microsoft asp.net framework, provides 6 built-in validation controls. 
1. RequiredFieldValidator
2. RangeValidator 
3. RegularExpressionValidator
4. CompareValidator
5. CustomValidator    
6. ValidationSummary





These validation controls can be used to perform both client side and server side validation.

Browser's understand only client scripts and HTML. In the past to perform client side validation, developers had to write themselves the required javascript code. With validation controls, we don't have to write javascript, we can use the built-in validation controls, which will generate the required javascript for us.

Client scripts can spread viruses and cause security concerns. Because of this, users may disable JavaScript on their browser. If this happens, client side validation is skipped. That is why, it is always a good practice to have server side validation as well.

The validation control's also perform server side validation. Server side validation is always performed, irrespective of whether the client side validation is done or not.

In this video we will discuss about RequiredField validator control. This control, ensures that the required field is entered by the user. Let us understand with an example.





Consider the HTML below. TextBox with ID="txtName" expects the user to enter their name. This is required field. Next to this textbox is a RequiredFieldValidator control, which is used to ensure that the user has entered his name. ControlToValidate property specifies the control to validate. ErrorMessage is the message that is displayed when the validation fails. To validate ddlGender DropDownList, we have RequiredFieldValidatorGender. We have specified InitialValue="-1". This will ensure that, if the user has selected, "Select Gender" option from the DropDownList, the control will still fail the validation.
<table>
    <tr>
        <td>
            <b>Name</b>
        </td>
        <td>
            :<asp:TextBox ID="txtName" runat="server" Width="150px">
            </asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidatorName" runat="server" 
            ErrorMessage="Name is required" ForeColor="Red"
            ControlToValidate="txtName" Display="Dynamic" >
            </asp:RequiredFieldValidator>
        </td>
    </tr>
    <tr>
        <td>
            <b>Gender</b>
        </td>
        <td>
            :<asp:DropDownList ID="ddlGender" runat="server" Width="150px">
                <asp:ListItem Text="Select Gender" Value="-1"></asp:ListItem>
                <asp:ListItem Text="Male" Value="Male"></asp:ListItem>
                <asp:ListItem Text="Female" Value="Female"></asp:ListItem>
            </asp:DropDownList>
            <asp:RequiredFieldValidator ID="RequiredFieldValidatorGender" runat="server" 
            ErrorMessage="Gender is required" ForeColor="Red" InitialValue="-1"
            ControlToValidate="ddlGender" Display="Dynamic" >
            </asp:RequiredFieldValidator>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <asp:Button ID="btnSave" runat="server" Text="Save" Width="100px" 
                onclick="btnSave_Click"/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <asp:Label ID="lblStatus" runat="server" Font-Bold="true">
            </asp:Label>
        </td>
    </tr>
</table>

Code-Behind code: Page.IsValid is a read-only property. This property returns true if all the validation controls has passed validation. Use this property to perform server side validation. 
protected void btnSave_Click(object sender, EventArgs e)
{
            
    if (Page.IsValid)
    {
        lblStatus.ForeColor = System.Drawing.Color.Green;
        lblStatus.Text = "Data saved successfully!";
    }
    else
    {
        lblStatus.ForeColor = System.Drawing.Color.Red;
        lblStatus.Text = "Data not valid and not saved!";
    }
}

Run the project, and notice that the client side validation is performed. Now, disable Javascript. To disable javascript in, internet explorer
1. Click on Tools on the Menu Bar. If the Menu bar is not visible, press ALT+T.
2. From the Tools menu, select Internet Options
3. Click on the Security tab, on the internet options window
4. Select Local Intranet icon and click on Cutom Level button
5. Scroll down in the Security Settings window, and find Scripting option in the list.
6. Click Disable radiobutton under active scripting
7. Click OK and click Yes on the warning.

The above steps should disable javascript. Run the project now, and click Save button, without entering any data. Notice, that the client side validation is skipped, but the server side validation is performed.