<%@ page language="C#" autoeventwireup="true" inherits="Passport_UserReg, WebApp_deploy" %>

<!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 id="Head1" runat="server">
    <title>注册</title>
    <link href="Css/LoginSheet.css" rel="stylesheet" type="text/css" />
    <link href="../Skin/TopStyle/Basic.css" rel="stylesheet" type="text/css" />
    <script src="../Skin/CommStyle/js/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            var regName = $("#<%=H_UserName.ClientID %>");
            var pass = $("#<%=H_UserPassword.ClientID %>");
            var regpass = $("#<%=RePassword.ClientID %>");
            var email = $("#<%=H_UserEmail.ClientID %>");
            var Answer = $("#<%=H_UserAnswer.ClientID %>");
            var code = $("#<%=CheckCode.ClientID %>");
            
            //用户名
            regName.blur(function () {
                if (regName.val() == "") {
                    $("#notice1").hide();
                    $("#lblname").text('请输入正确的用户名');
                    regName.addClass("form_dashed");
                } else {
                    var regNameWord = /^\w$/; //字母、数字、下划线
                    var wordNBool = true;
                    for (i = 0; i < regName.val().length; i++) {
                        var word1 = regName.val().charAt(i);
                        if (regNameWord.test(word1) == true) {
                            wordNBool = true;
                        } else {
                            wordNBool = false;
                            break;
                        }
                    }
                    if (wordNBool == false) {
                        $("#notice1").hide();
                        $("#lblname").text('用户名由数字，字母或者下划线组成！');
                        regName.addClass("form_dashed");
                    } else {
                        //用户名3-15个字符
                        if (regName.val().length < 3 || regName.val().length > 15) {
                            $("#notice1").hide();
                            $("#lblname").text('用户名为3-15个字符!');
                            regName.addClass("form_dashed");
                        } else {
                            $("#lblname").text('');
                            regName.removeClass("form_dashed");
                        }
                    }
                }
            });

            pass.blur(function () {
                if (pass.val() == "") {
                    $("#notice2").hide();
                    $("#lblpass").text('请输入密码');
                    pass.addClass("form_dashed");
                } else {
                    if ( pass.val().length >= 6&&pass.val().length<=20) {
                        $("#notice2").show();
                        $("#lblpass").text('');
                        pass.removeClass("form_dashed");
                    } else {
                        $("#notice2").hide();
                        $("#lblpass").text('密码长度应在6-20个字符之间');
                        pass.addClass("form_dashed");
                        return false;
                    }
                }
            });
            regpass.blur(function () {
                if (regpass.val() == "") {
                    $("#notice3").hide();
                    $("#lblrepass").text('请重新输入密码');
                    regpass.addClass("form_dashed");
                } else {
                    if (regpass.val() != pass.val()) {
                        $("#notice3").hide();
                        $("#lblrepass").text('两次输入的密码不一致');
                        regpass.addClass("form_dashed");
                    } else {
                        $("#notice3").show();
                        $("#lblrepass").text('');
                        regpass.removeClass("form_dashed");
                    }
                }
            });
            email.blur(function () {
                if (email.val() == "") {
                    $("#lbleamil").text('请输入电子邮件');
                    email.addClass("form_dashed");
                } else {

                    if (email.val().charAt(0) == "." ||
                    email.val().charAt(0) == "@" ||
                    email.val().indexOf('@', 0) == -1 ||
                    email.val().indexOf('.', 0) == -1 ||
                    email.val().lastIndexOf("@") == email.val().length - 1 ||
                   email.val().lastIndexOf(".") == email.val().length - 1) {
                        $("#lbleamil").text('电子邮件格式不正确');
                        email.addClass("form_dashed");
                    } else {
                        $("#lbleamil").text('');
                        email.removeClass("form_dashed");
                    }
                }
            });
            Answer.blur(function () {
                if (Answer.val() == "") {
                    $("#lblAnswer").text('请输入您的答案');
                    Answer.addClass("form_dashed");
                } else {
                    $("#lblAnswer").text('');
                    Answer.removeClass("form_dashed");
                }
            });
            code.blur(function () {
                if (code.val() == "") {
                    $("#lblcode").text('请输入验证码');
                    code.addClass("form_dashed");
                } else {
                    $("#lblcode").text('');
                    code.removeClass("form_dashed");
                }
            });
        });

        function regSubmit() {
            var regName = $("#<%=H_UserName.ClientID %>");
            var pass = $("#<%=H_UserPassword.ClientID %>");
            var regpass = $("#<%=RePassword.ClientID %>");
            var email = $("#<%=H_UserEmail.ClientID %>");
            var Answer = $("#<%=H_UserAnswer.ClientID %>");
            var code = $("#<%=CheckCode.ClientID %>");
            //用户名
            if (regName.val() == "") {
                $("#notice1").hide();
                $("#lblname").text('请输入正确的用户名');
                regName.addClass("form_dashed");
            } else {
                var regNameWord = /^\w$/; //字母、数字、下划线
                var wordNBool = true;
                for (i = 0; i < regName.val().length; i++) {
                    var word1 = regName.val().charAt(i);
                    if (regNameWord.test(word1) == true) {
                        wordNBool = true;
                    } else {
                        wordNBool = false;
                        break;
                    }
                }
                if (wordNBool == false) {
                    $("#notice1").hide();
                    $("#lblname").text('用户名由数字，字母或者下划线组成！');
                    regName.addClass("form_dashed");
                } else {
                    //用户名3-15个字符
                    if (regName.val().length < 3 || regName.val().length > 15) {
                        $("#notice1").hide();
                        $("#lblname").text('用户名为3-15个字符!');
                        regName.addClass("form_dashed");
                    } else {
                        $("#lblname").text('');
                        regName.removeClass("form_dashed");
                    }
                }
            }

            if (pass.val() == "") {
                $("#notice2").hide();
                $("#lblpass").text('请输入密码');
                pass.addClass("form_dashed");
                return false;
            } else {
                if (pass.val().length >= 6 && pass.val().length <= 20) {

                    $("#notice2").show();
                    $("#lblpass").text('');
                    pass.removeClass("form_dashed");
                } else {

                    $("#notice2").hide();
                    $("#lblpass").text('密码长度应在6-20个字符之间');
                    pass.addClass("form_dashed");
                    return false;
                }
            }
            if (regpass.val() == "") {
                $("#notice3").hide();
                $("#lblrepass").text('请重新输入密码');
                regpass.addClass("form_dashed");
                return false;
            } else {
                if (regpass.val() != pass.val()) {
                    $("#notice3").hide();
                    $("#lblrepass").text('两次输入的密码不一致');
                    regpass.addClass("form_dashed");
                    return false;
                } else {
                    $("#notice3").show();
                    $("#lblrepass").text('');
                    regpass.removeClass("form_dashed");
                }
            }

            if (email.val() == "") {
                $("#lbleamil").text('请输入电子邮件');
                email.addClass("form_dashed");
            } else {

                if (email.val().charAt(0) == "." ||
                    email.val().charAt(0) == "@" ||
                    email.val().indexOf('@', 0) == -1 ||
                    email.val().indexOf('.', 0) == -1 ||
                    email.val().lastIndexOf("@") == email.val().length - 1 ||
                   email.val().lastIndexOf(".") == email.val().length - 1) {
                    $("#lbleamil").text('电子邮件格式不正确');
                    email.addClass("form_dashed");
                } else {
                    $("#lbleamil").text('');
                    email.removeClass("form_dashed");
                }
            }
            if (Answer.val() == "") {
                $("#lblAnswer").text('请输入您的答案');
                Answer.addClass("form_dashed");
                return false;
            } else {
                $("#lblAnswer").text('');
                Answer.removeClass("form_dashed");
            }
            if (code.val() == "") {
                $("#lblcode").text('请输入验证码');
                code.addClass("form_dashed");
                return false;
            } else {
                $("#lblcode").text('');
                code.removeClass("form_dashed");
            }

            if (!$("#read_agreement").is(":checked")) {
                $("#lblClause").addClass("form_dashed");
                $("#Label1").text("您没有同意协议");
                return false;
            } else {
                $("#lblClause").removeClass("form_dashed");
                $("#Label1").text("");
            }
            return true;
        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <hl:Top ID="Top1" runat="server" />
    <div class="content">
        <div class="module_common">
            <div class="wrap">
                <div class="wrap_child">
                    <div class="login_con">
                        <div class="login_fill_in">
                            <h2>
                                <b title="<用户注册>">用户注册</b>JOIN US</h2>
                            <table>
                                <tr>
                                    <td colspan="3">
                                        <h4>
                                            填写用户注册信息</h4>
                                    </td>
                                </tr>
                                <tr id="tabMember" runat="server" class="reg_table">
                                    <th>
                                        会员类型：
                                    </th>
                                    <td>
                                        <asp:RadioButtonList ID="RadioMemberList" runat="server" RepeatDirection="Horizontal"
                                            AutoPostBack="True">
                                        </asp:RadioButtonList>
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        用户名:
                                    </th>
                                    <td>
                                        <asp:TextBox ID="H_UserName" runat="server" CssClass="text width180" MaxLength="20" />
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="field_notice" id="notice1">
                                            3-15个字符，由数字，字母或者下划线组成！</label>
                                        <label class="error" id="lblname">
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        密码:
                                    </th>
                                    <td>
                                        <asp:TextBox ID="H_UserPassword" runat="server" CssClass="text width180" TextMode="Password"
                                            MaxLength="16" />
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="field_notice" id="notice2">
                                            6-20个字符</label>
                                        <label class="error" id="lblpass">
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        确认密码:
                                    </th>
                                    <td>
                                        <asp:TextBox ID="RePassword" runat="server" CssClass="text width180" TextMode="Password" />
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="field_notice" id="notice3">
                                            再次输入您的密码</label>
                                        <asp:Panel ID="ShowPasswordCheck" runat="server">
                                        </asp:Panel>
                                        <label class="error" id="lblrepass">
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        电子邮件:
                                    </th>
                                    <td>
                                        <asp:TextBox ID="H_UserEmail" runat="server" CssClass="text width180" />
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="error" id="lbleamil">
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        密码提问:
                                    </th>
                                    <td>
                                        <asp:DropDownList ID="H_UserQuestion" runat="server" CssClass="text width180" DataTextField="Name">
                                        </asp:DropDownList>
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="field_notice">
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        密码提示答案:
                                    </th>
                                    <td>
                                        <asp:TextBox ID="H_UserAnswer" runat="server" CssClass="text width180" />
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="error" id="lblAnswer">
                                        </label>
                                    </td>
                                </tr>
                                <asp:PlaceHolder ID="RegProtected" runat="server" Visible="false">
                                    <tr>
                                        <td colspan="3">
                                            <div class="reg_row">
                                                <div class="reg_div_left">
                                                    注册回答问题：</div>
                                                <div class="reg_div_right">
                                                    <div style="float: left;">
                                                        <asp:Literal ID="RegCheckQuestion" runat="server" /></div>
                                                </div>
                                            </div>
                                            <div class="reg_row">
                                                <div class="reg_div_left">
                                                    注册回答答案：</div>
                                                <div class="reg_div_right">
                                                    <div style="float: left;">
                                                        <asp:TextBox ID="ReqCheckAnswer" CssClass="reg_textbox" runat="server" /></div>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                </asp:PlaceHolder>
                                <tr>
                                    <th>
                                        性别:
                                    </th>
                                    <td>
                                        <asp:RadioButtonList ID="H_UserSex" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow">
                                            <asp:ListItem Text="男" Value="0" Selected="True" />
                                            <asp:ListItem Text="女" Value="1" />
                                        </asp:RadioButtonList>
                                    </td>
                                    <td class="padding3 fontColor4">
                                    </td>
                                </tr>
                                <tr id="EnableRegCheckCode" runat="server">
                                    <th>
                                        验证码:
                                    </th>
                                    <td>
                                        <asp:TextBox ID="CheckCode" runat="server" CssClass="text" MaxLength="5" Width="90" />
                                        <a onclick="javascript:refreshCode();" href="#" id="ImgCheckCode"></a>
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="error" id="lblcode">
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <th rowspan="2">
                                    </th>
                                    <td>
                                        <input type="checkbox" value="1" runat="server" checked="checked" id="read_agreement" />
                                        <label for="clause" id="lblClause">
                                            我已阅读并同意
                                            <a href="#" target="_blank" class="agreement">用户服务协议</a></label>
                                    </td>
                                    <td class="padding3 fontColor4">
                                        <label class="error" id="Label1">
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <asp:Button ID="RegSubmitButton" runat="server" CssClass="login_btn" OnClientClick="return regSubmit() " />
                                    </td>
                                </tr>
                            </table>
                        </div>
                        <div class="login_right">
                            <h4>
                                提示:
                            </h4>
                            <p>
                                注册之后你就可以</p>
                            <ol>
                                <li class="ico01">保存您的个人资料</li>
                                <li class="ico02">收藏您关注的产品</li>
                                <li class="ico03">收藏您关注的店铺</li>
                                <li class="ico04">开设店铺销售商品</li>
                                <div class="clear">
                                </div>
                            </ol>
                            <h4 style="margin-top: 24px;">
                                如果已经拥有帐号</h4>
                            <a href="Login.aspx" class="enter" title="现在登录"></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <asp:HiddenField ID="H_Other" runat="server" />
    <asp:HiddenField ID="H_ComeUrl" runat="server" />
    <hl:Foot ID="Foot1" runat="server" />
    <script type="text/javascript">
        function check_RegQuestion() {
            var _question = document.getElementById("<%=H_UserQuestion.ClientID %>").value;
        }


        function refreshCode() {
            document.getElementById("ImgCheckCode").innerHTML = "<img src='CheckCode.aspx?rnd=" + Math.random() + "' title='看不清楚，请点击更换验证码' />";
        }
        refreshCode();
    </script>
    </form>
</body>
</html>
