semjinghua 2016-09-01
没有办法直接使用bootstrapValidator验证百度Ueditor组件,因为ueditor生成的编辑框都是DIV拼凑起来的,并不是textarea组件。于是换了一种思路,使用ue的内容改变事件:
var domUtils = UE.dom.domUtils; ueditor.addListener('ready',function(){ //ueditor.focus(true); domUtils.on(ueditor.body,"keyup",function(){ var count=ueditor.getContentLength(true); if (count>50 && count<4000) $("#contentErrorInfo").text(""); }); });
当内容改变时,通过ue自带的文本长度API来判断是否合乎条件,当条件成立时去掉错误信息。
另外,在提交表单时,验证ue的内容:
var count=ueditor.getContentLength(true); if (count<50 || count >4000){ $("#contentErrorInfo").text("参赛作文内容长度必须在50到4000位之间"); } $('#defaultForm').data('bootstrapValidator').validate(); //手动验证表单,当是普通按钮时 var isValid = $('#defaultForm').data('bootstrapValidator').isValid();
需要说明的是错误信息的样式是从bootstrapValidator在界面生成后copy的:
<div id="contentError" class="form-group has-feedback has-error"> <small class="help-block" data-bv-validator="notEmpty" data-bv-for="content" data-bv-result="INVALID" style=""> <span id="contentErrorInfo"></span> </small> </div>
id=3&hmsr=%E5%BC%80%E5%8F%91%E8%80%85-AI%E5%AD%A6%E4%B9%A0%E8%B7%AF%E7%BA%BF&hmpl=&hmcu=&hmkw=&hmci=