C# asp.net网站的引导验证_C#_Asp.net_Twitter Bootstrap

C# asp.net网站的引导验证

c# asp.net twitter-bootstrap

C# asp.net网站的引导验证,c#,asp.net,twitter-bootstrap,C#,Asp.net,Twitter Bootstrap,我使用下面的代码来验证表单文件，但是代码似乎工作不正常。怎么了单击“登录”按钮时，将显示相应的错误消息，但“登录”按钮将自动禁用作为参考，我使用以下链接：我的代码： <%@ Page Language="C#" AutoEventWireup="true" CodeFile="login.aspx.cs" Inherits="login" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

我使用下面的代码来验证表单文件，但是代码似乎工作不正常。怎么了

单击“登录”按钮时，将显示相应的错误消息，但“登录”按钮将自动禁用

作为参考，我使用以下链接：

我的代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="login.aspx.cs" Inherits="login" %>

<!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">
    <meta charset="UTF-8">
        <title>Prajakta Services | Log in</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <!-- bootstrap 3.0.2 -->
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- font Awesome -->
        <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" />

        <!-- Theme style -->
        <link href="css/AdminLTE.css" rel="stylesheet" type="text/css" />

        <!-- jQuery 2.0.2 -->
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

        <!-- Bootstrap -->
        <script src="js/bootstrap.min.js" type="text/javascript"></script>

        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
          <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
        <![endif]-->

    <script type="text/javascript" language="javascript" src="js/jquery-1.10.2.min.js"></script>

    <script type="text/javascript" language="javascript" src="js/bootstrapValidator.js"></script>

    <link href="css/bootstrapValidator.css" rel="stylesheet" type="text/css" />


<script type="text/javascript">
$(document).ready(function() {
    $('#form1').bootstrapValidator({
        //live: 'disabled',
        message: 'This value is not valid',
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            //invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            txt_user_id: {
                validators: {
                    notEmpty: {
                        message: 'The first name is required and cannot be empty'
                    }
                }
            },
            txt_password: {
                validators: {
                    notEmpty: {
                        message: 'The password is required and cannot be empty'
                    },
                    different: {
                        field: 'username',
                        message: 'The password cannot be the same as username'
                    }
                }
            },
         }
    });
});
</script>
</head>
<body class="bg-black">
    <form id="form1" method="post" runat="server">
    <div>
    <div class="form-box" id="login-box">
            <div class="header">Sign In</div>

                <asp:Label ID="lbl_msg" runat="server" Text=""></asp:Label>
                <div class="body bg-gray">
                    <div class="form-group">
                        <asp:TextBox ID="txt_user_id" name="userid" runat="server" class="form-control" placeholder="User ID"></asp:TextBox>
                    </div>
                    <div class="form-group">
                        <asp:TextBox ID="txt_password" runat="server" name="pass" class="form-control" placeholder="Password" TextMode="Password"></asp:TextBox>
                    </div>
                </div>
                <div class="footer">                                                               
                    <asp:Button ID="btn_login" runat="server" Text="Login" 
                        class="btn bg-olive btn-sm" onclick="btn_login_Click"/>

                    <asp:Button ID="btn_cancel" runat="server" Text="Cancel" 
                        class="btn bg-olive btn-sm"/>

                    <p><a href="#">I forgot my password</a><br />
                    <a href="register.aspx">Sign Up</a></p>
                </div>
        </div>
    </div>
    <br />
    </form>
</body>
</html>


Prajakta服务|登录
$（文档）.ready（函数（）{
$（'#form1'）。bootstrapValidator({
//现场直播：“残疾人”，
消息：“此值无效”，
反馈图标：{
有效：“glyphicon glyphicon ok”，
//无效：“glyphicon glyphicon删除”，
正在验证：“glyphicon glyphicon刷新”
},
字段：{
txt\u用户\u id:{
验证器：{
注意：{
消息：“名字是必需的，不能为空”
}
}
},
txt_密码：{
验证器：{
注意：{
消息：“密码是必需的，不能为空”
},
不同的：{
字段：“用户名”，
消息：“密码不能与用户名相同”
}
}
},
}
});
});
登录

请您建议我的代码中需要的更正，并提前感谢您的建议

第一个观察结果是，您这里似乎有一个打字错误：

$('#from1').validate

这不应该是：

$('#form1').validate

我在这里解决了这个问题，这是供将来参考的解决方案。我将java脚本代码放在开头部分，然后包括所有必需的

js

文件

<head>
<script type="text/javascript">
    $(document).ready(function() {
        $('#form1').bootstrapValidator({
            feedbackIcons: {
                valid: 'fa fa-check',
                invalid: 'fa fa-times',
                validating: 'fa fa-refresh'
            },
            fields: {
                // There is no single quote
                userid: {
                    validators: {
                        notEmpty: {
                            message: 'The username is required and cannot be empty'
                        },
                        stringLength: {
                            min: 6,
                            max: 30,
                            message: 'The username must be more than 6 and less than 30 characters long'
                        },
                        regexp: {
                            regexp: /^[a-zA-Z0-9]+$/,
                            message: 'The username can only consist of alphabetical and number'
                        },
                        different: {
                            field: 'password',
                            message: 'The username and password cannot be the same as each other'
                        }
                    }
                },
                pass: {
                    validators: {
                        notEmpty: {
                            message: 'The password is required and cannot be empty'
                        },
                    }
               }
            }
        });
    });
</script>
</head>

<body>
<form id="form1" method="post" runat="server">
    <div>
    <div class="form-box" id="login-box">
            <div class="header">Sign In</div>
                <asp:Label ID="lbl_msg" runat="server" Text=""></asp:Label>
                <div class="body bg-gray">
                    <div class="form-group">
                        <asp:TextBox ID="txt_user_id" runat="server" class="form-control" placeholder="User ID" name="userid"
                        required data-bv-notempty-message="The User ID is required and cannot be empty"></asp:TextBox>

                    </div>
                    <div class="form-group">
                        <asp:TextBox ID="txt_password" runat="server" class="form-control" placeholder="Password" TextMode="Password" name="pass"
                        required data-bv-notempty-message="The password is required and cannot be empty"></asp:TextBox>

                    </div>
                </div>

                <div class="footer">                                                               
                    <asp:Button ID="btn_login" runat="server" Text="Login" 
                        class="btn bg-olive btn-sm" onclick="btn_login_Click"/>

                    <asp:Button ID="btn_cancel" runat="server" Text="Cancel"
                        class="btn bg-olive btn-sm" OnClientClick="resetFields(form1);"/>

                    <p><a href="#">I forgot my password</a><br />
                    <a href="register.aspx">Sign Up</a></p>
                </div>
        </div>
    </div>
    <br />
    </form>
</body>


$（文档）.ready（函数（）{
$（'#form1'）。bootstrapValidator({
反馈图标：{
有效：'fa-fa-check'，
无效：“fa-fa-times”，
正在验证：“fa刷新”
},
字段：{
//没有单一的报价
用户标识：{
验证器：{
注意：{
消息：“用户名是必需的，不能为空”
},
弦长：{
民:6,，
最高：30，
消息：“用户名长度必须大于6个字符且小于30个字符”
},
regexp:{
regexp://^[a-zA-Z0-9]+$/,，
消息：“用户名只能由字母和数字组成”
},
不同的：{
字段：“密码”，
消息：“用户名和密码不能相互相同”
}
}
},
通过：{
验证器：{
注意：{
消息：“密码是必需的，不能为空”
},
}
}
}
});
});
登录

感谢您的良好响应，非常感谢

尝试使用setDefaults而不是setDefaults-javascript区分大小写。