Bootstrap验证不起作用 - 简单形式

时间:2016-08-27 07:44:00

标签: twitter-bootstrap bootstrapvalidator

我有一个简单的表单,我想使用Bootstrap验证。 我包括所有要求(jquery.js,bootstrap.js,bootstrap.min.js,bootstrap.css,bootstrap.min.css,bootstrapValidator.js,bootstrapValidator.css):

<script type="text/javascript" src="assets/layout/scripts/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="assets/layout/scripts/bootstrap/bootstrap.js"></script>
<script src="assets/layout/scripts/bootstrap/bootstrap.min.js"></script>

<link rel="stylesheet" href="assets/layout/styles/bootstrap/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="assets/layout/styles/bootstrap/bootstrap.min.css" type="text/css" />
<script type="text/javascript" src="assets/layout/scripts/bootstrap_value/bootstrapValidator.js"></script>
<link rel="stylesheet" href="assets/layout/styles/bootstrap_value/bootstrapValidator.css" type="text/css" />

我的简单形式:

<form id="signup_form"  action="do.php"  method="post" style="text-align: center">

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label class="control-label">نام کاربری</label>
                <input type="text" class="form-control" name="username" />
            </div>
        </div>
        <div class="col-md-6">
            <div class="form-group">
                <label class="control-label">رمز ورود</label>
                <input type="text" class="form-control" name="pass"/>
            </div>
        </div>
    </div>

    <input type="submit" value="Submit"/>


</form>

我的剧本:

<script type="text/javascript">
    $(document).ready(function() {
        $('#signup_form').bootstrapValidator({
            live: 'submitted',
            fields: {

                username: {
                    validators: {
                        notEmpty: {
                            message: '.نام خود را وارد کنید'
                        }
                    }
                },
                pass: {
                    validators: {
                        notEmpty: {
                            message: '.رمز کاربری خود را وارد کنید'
                        }
                    }
                }
            }
        });
    });
</script>

按空字段,点击submit按钮后,表单会显示在do.php文件中。

已更新

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="assets/layout/scripts/bootstrap/bootstrap.js"></script>
    <link rel="stylesheet" href="assets/layout/styles/bootstrap/bootstrap.css" type="text/css" />
    <script type="text/javascript" src="assets/layout/scripts/bootstrap_value/bootstrapValidator.js"></script>
    <link rel="stylesheet" href="assets/layout/styles/bootstrap_value/bootstrapValidator.css" type="text/css" />

0 个答案:

没有答案
相关问题