我有一个简单的表单,我想使用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" />