Tuesday, March 20, 2012

POPUP WITH VALIDATIONS

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test POPUP</title>
    <link id="css" href="styles_w.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <div id="right" align="center">
            <div class="right_s">
                <br />
                <h2>
                    Test Register System</h2>
                <br />
                <br />
                <h3 style="color: #0066FF">
                    Here is Registration Page ...
                </h3>
                <br />
                <h4 align="center" style="color: #0066FF">
                    Please Click Next to Begin!</h4>
                <br />
                <asp:Button ID="registerLink" runat="server" Text="NEXT ... !" CssClass="gen_button" />
                <asp:Panel ID="SignupPanelOuter" runat="server" CssClass="outerPopup" Style="display: none;"
                    Width="410px" Height="350px">
                    <asp:Panel ID="SignupPanelInner" runat="server" CssClass="innerPopup" Width="410px"
                        Height="350px">
                        <div style="height: 350px; width: 400px">
                            <table style="width: 400px">
                                <tr>
                                    <td align="left">
                                        <img src="Images/register.gif" alt="Register Here" height="30px" width="30px" /></td>
                                    <td valign="middle">
                                        <h3>
                                            Welcome To test</h3>
                                    </td>
                                    <td align="right">
                                        <asp:ImageButton ID="ImageButton1" ImageUrl="Images/150px-Crystal_button_cancel.svg.png"
                                            ImageAlign="Right" runat="server" CausesValidation="false" Height="20px" Width="20px"
                                            OnClick="sigUpCancel_Click" /></td>
                                </tr>
                                <tr>
                                    <td colspan="3" valign="middle">
                                        <hr style="width: 400px" />
                                    </td>
                                </tr>
                                <tr>
                                    <td valign="middle" style="width: 100px">
                                        <asp:Label ID="name_lbl" runat="server" Text="User Name" Width="100px"></asp:Label></td>
                                    <td valign="middle" style="width: 130px">
                                        <asp:TextBox ID="name_txt" runat="server" Width="130px"></asp:TextBox></td>
                                    <td valign="middle" style="width: 120px">
                                        <asp:RequiredFieldValidator ValidationGroup="client" ID="RequiredFieldValidator1"
                                            runat="server" ErrorMessage="Enter Name" ControlToValidate="name_txt"></asp:RequiredFieldValidator>
                                        <cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender2" runat="server" FilterType="Custom, UppercaseLetters,LowercaseLetters"
                                            ValidChars=" " TargetControlID="name_txt">
                                        </cc1:FilteredTextBoxExtender>
                                    </td>
                                    <tr>
                                        <td colspan="3">
                                        </td>
                                    </tr>
                                <tr>
                                    <td valign="middle" style="width: 100px">
                                        <asp:Label ID="gender_lbl" runat="server" Text="Gender M/F" Width="100px"></asp:Label></td>
                                    <td valign="middle" style="width: 130px">
                                        <asp:RadioButtonList ID="gender_RadioButtonList" runat="server" Height="16px" Width="44px"
                                            RepeatDirection="Horizontal">
                                            <asp:ListItem>M</asp:ListItem>
                                            <asp:ListItem>F</asp:ListItem>
                                        </asp:RadioButtonList></td>
                                    <td valign="middle">
                                        <asp:RequiredFieldValidator ValidationGroup="client" ID="genderValidator"
                                            runat="server" ErrorMessage="Select gender" ControlToValidate="gender_RadioButtonList"></asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="3">
                                    </td>
                                </tr>
                                <tr>
                                    <td valign="middle" style="width: 100px">
                                        <asp:Label ID="Label1" runat="server" Text="User ID" Width="100px"></asp:Label>
                                    </td>
                                    <td valign="middle" style="width: 130px">
                                        <asp:TextBox ID="userid_txt" runat="server" Width="130px"></asp:TextBox></td>
                                    <td valign="middle" style="width: 120px">
                                        <asp:RequiredFieldValidator ValidationGroup="client" ID="RequiredFieldValidator2"
                                            runat="server" ErrorMessage="Enter userid" ControlToValidate="userid_txt"></asp:RequiredFieldValidator>
                                        <cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender3" runat="server" FilterType="Custom, UppercaseLetters,LowercaseLetters,Numbers"
                                            ValidChars=" " TargetControlID="userid_txt">
                                        </cc1:FilteredTextBoxExtender>
                                    </td>
                                </tr>
                                <tr>
                                    <td valign="middle" style="width: 100px">
                                        <asp:Label ID="Label4" runat="server" Text="Contact #"></asp:Label></td>
                                    <td valign="middle" style="width: 130px">
                                        <asp:TextBox ID="contact_txt" runat="server" Width="130px"></asp:TextBox></td>
                                    <td valign="middle" style="width: 120px">
                                        <asp:RequiredFieldValidator ValidationGroup="client" ID="RequiredFieldValidator4"
                                            runat="server" ErrorMessage="Enter Contact Number" ControlToValidate="contact_txt"></asp:RequiredFieldValidator>
                                        <cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender4" runat="server" FilterType="Custom,Numbers"
                                            ValidChars="+,-" TargetControlID="contact_txt">
                                        </cc1:FilteredTextBoxExtender>
                                    </td>
                                </tr>
                                <tr>
                                    <td valign="middle" style="width: 100px">
                                        <asp:Label ID="Label5" runat="server" Text="Email ID"> </asp:Label></td>
                                    <td valign="middle" style="width: 130px">
                                        <asp:TextBox ID="email_txt" runat="server" Width="130px"></asp:TextBox></td>
                                    <td valign="middle" style="width: 120px">
                                        <asp:RequiredFieldValidator ValidationGroup="client" ID="RequiredFieldValidator5"
                                            runat="server" ErrorMessage="Plz Enter Email ID" ControlToValidate="email_txt"></asp:RequiredFieldValidator>
                                        <cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender5" runat="server" FilterType="Custom, UppercaseLetters,LowercaseLetters,Numbers"
                                            ValidChars="-,_,., @" TargetControlID="email_txt">
                                        </cc1:FilteredTextBoxExtender>
                                    </td>
                                </tr>
                                <tr>
                                    <td valign="middle" colspan="2">
                                        <asp:Label ID="error_lbl" runat="server" Text=" " Font-Bold="True" ForeColor="Red"></asp:Label></td>
                                    <td valign="middle">
                                        <asp:Button ID="signUp_btn" ValidationGroup="client" runat="server" Text="Sign Up" CausesValidation="true"
                                            CssClass="gen_button" OnClick="signUp_btn_Click" /></td>
                                </tr>
                            </table>
                        </div>
                    </asp:Panel>
                </asp:Panel>
                <cc1:ModalPopupExtender ID="ModalPopupExtenderSignUp" runat="server" TargetControlID="registerLink"
                    PopupControlID="SignupPanelOuter" BehaviorID="ModalPopupExtenderSignUp" BackgroundCssClass="modalBackground"
                    DropShadow="true" />
                <cc1:RoundedCornersExtender ID="RoundedCornersExtender2" runat="server" BehaviorID="RoundedCornersExtender2"
                    TargetControlID="SignupPanelInner" BorderColor="black" Radius="8" />
            </div>
        </div>
    </form>
</body>
</html>
By at

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)