我尝试使用Bootstrap Validator验证字符串的长度。不幸的是,JavaScript不起作用。我想的可能是语法错误。
HTML:
<form id="ordertracking" role="form">
<div style="margin-bottom: 12px" class="input-group">
<span class="input-group-addon"><strong>@</strong></span>
<input id="login-username" type="text" class="form-control" name="email" placeholder="Email">
<span class="input-group-addon"><i class="glyphicon glyphicon-barcode"></i></span>
<input id="login-password" type="text" class="form-control" name="customerNum" placeholder="Customer #">
</form>
JS:
$('#ordertracking').bootstrapValidator({
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
email: {
validators: {
stringLength: {
min: 5,
max: 50,
message: 'The full email must be less than 50 characters'
}
}
},
customerNum: {
validators: {
stringLength: {
min: 4,
max: 6,
message: 'The customer number has to be 5 or 6 digits'
}
}
}
}
});
指向Codepen的链接:http://codepen.io/Delano83/pen/bwQZbB
我已经开了两个小时了,所以我们非常感谢任何建议。
答案 0 :(得分:2)
您尚未收录图书馆:
将此添加到所有其他脚本下方的head部分,它应该可以正常工作。
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.3/js/bootstrapValidator.min.js"></script>
如果您检查控制台,您将看到此错误:
Uncaught TypeError: $(...).bootstrapValidator is not a function
这让我意识到库没有正确加载。