我正在使用bootstrap 3.3的bootstrapvalidator
我需要在模态对话框中重置一个表单.
我使用了正确的方法,但它不适用于模态对话框.
$('#emailForm').bootstrapValidator("resetForm",true);
如果我打开模式并插入电子邮件,然后尝试重置表单,验证控件仍然存在.
javascript css jquery twitter-bootstrap jqbootstrapvalidation
我在模态内部使用bootstrap验证器.验证器在后续的表单访问中保留.例如,如果执行以下操作
再次访问表单,字段的颜色仍保持绿色,因为我在之前的表单提交中输入了有效条目
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Add new Node</h4>
</div>
<div class="modal-body">
<div class="modal-body">
<form role="form" id="addNodeForm">
<div class="form-group">
<label for="nodename" class="control-label">Node Name</label>
<input type="text" name="nodename" class="form-control" id="nodename" required>
</div>
</form>
</div>
<!-- <div class="alert alert-success">
<a href="#" class="close" data-dismiss="alert">×</a>
<div id="thanks"></div>
</div> -->
</div>
<div class="modal-footer">
<button type="button" id="add-close" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="add-save" class="btn btn-primary">Save changes</button>
</div>
</div> …我有一个动态表单,绑定knockout.js和验证bootstrapValidator.
根据另一个控件的状态,有一个输入字段需要"必需 - 验证".
输入字段:
<textarea id="inputReason" name="inputReason" rows="3"
class="form-control col-lg-8"
data-bind="value: Reason" />
knockout-viewmodel的相关javascript部分:
self.SelectAbsenceType = function (absenceType) {
self.SelectedID(absenceType.ID);
if (self.SelectedAbsenceType().ReasonRequired) {
$('#formCreate').bootstrapValidator('addField', 'inputReason', {
validators: {
notEmpty: {
message: 'Please enter a reason'
}
}
});
} else {
$('#formCreate').bootstrapValidator('removeField', 'inputReason');
}
}
我面临的问题是removeField对bootstrapValidator实例的调用似乎并没有完全删除所有注册信息,因为updateStatus在bootstrapValidator类的方法中存在一个javascript异常,实际上根本不应该调用它,因为我已经删除了该字段之前:
var that = this,
type = fields.attr('type'),
group = this.options.fields[field].group || this.options.group,
total = ('radio' === type || 'checkbox' === type) …javascript jquery knockout.js twitter-bootstrap-3 jqbootstrapvalidation
我在文本区域使用ckeditor,我需要设置自定义验证.
在示例之后,我以这种方式使用jquery适配器设置文本框:
$('#posteditor')
.bootstrapValidator()
.find('[name="text"]').ckeditor({
skin: 'moono,/asset/css/moono/',
language: 'it',
toolbarGroups: [
{"name":"basicstyles","groups":["basicstyles"]},
{"name":"paragraph","groups":["list","align"]},
{"name":"insert","groups":["insert"]},
{"name":"styles","groups":["styles"]},
{"name":"links","groups":["links"]},
],
removeButtons: 'Strike,SpecialChar,Anchor',
extraPlugins: 'youtube'
}).editor.on('change', function() {
$('#posteditor')
.bootstrapValidator('updateStatus', 'text', 'NOT_VALIDATED')
.bootstrapValidator('validateField', 'text');
});
用这种方式在我的html中声明它
<form id="posteditor">
....
<textarea class="form-control" name="text" id="text"></textarea>
....
</form>
当onchange事件被触发时,javascript控制台会显示该消息
Uncaught TypeError: Cannot read property 'group' of undefined
并且该字段未经过验证.
谢谢你的帮助
我一直在研究Bootstrap验证器,我已经复制并格式化了它们的示例,并包含了所有必需的Bootstrap和Bootstrap验证器和jQuery代码,但是示例并没有像它暗示的那样工作.
这是我的代码.
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/> <!-- Bootstrap 3 -->
<link rel="stylesheet" href="bootstrap_validator/css/bootstrapValidator.css"/>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script> <!-- Bootstrap 3 -->
<script type="text/javascript" src="bootstrap_validator/js/bootstrapValidator.js"></script>
<form id="registerform" class="form-horizontal">
<div class="form-group">
<label class="col-lg-2 control-label">Account</label>
<div class="col-lg-4">
<input type="text" class="form-control" name="username" placeholder="Username" />
</div>
<div class="col-lg-4">
<input type="text" class="form-control" name="email" placeholder="Email address" />
</div>
</div>
</form>
<script type="text/javascript">
$(document).ready(function() {
$('#registerform').bootstrapValidator({
live: 'enabled',
message: 'This value is not valid',
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon …