Jquery验证不与ckeditor一起使用

PHP*_*der 16 jquery jquery-validate ckeditor

我使用jQuery来验证表单..但是当我使用CKeditor并尝试使用jQuery验证它时,它不起作用.

这是HTML代码的片段

  <form class="form-horizontal" role="form" name="f3" id="f3" >
   <div class="col-xs-8">
       <textarea class="ckeditor" name="cktext" id="cktext"></textarea>
   </div>
    <button type="submit" class="btn btn-default btn-success">Submit</button>
  </form>
Run Code Online (Sandbox Code Playgroud)

这是表单验证代码

    <script>
           $(document).ready(function(){
           $("#f3").validate(
            {
              debug: false,
                rules: { 
                    cktext:{

                     required:true,
                     minlenght:10
                    }
                 }
            });
        });
      </script>
Run Code Online (Sandbox Code Playgroud)

仅供参考:为其他表单字段工作的jquery验证期望ckeditor textarea提交

任何建议..摆脱这个问题..

PHP*_*der 29

最后我找到了问题的答案......

我更改了默认保存的ignore属性的值:隐藏值.因为CKEDITOR隐藏textarea jQuery验证不验证元素:

   ignore: []  
Run Code Online (Sandbox Code Playgroud)

我刚刚更改了验证脚本,如下所示.

     $(document).ready(function(){

            $("#f3").validate(
            {
                ignore: [],
              debug: false,
                rules: { 

                    cktext:{
                         required: function() 
                        {
                         CKEDITOR.instances.cktext.updateElement();
                        },

                         minlength:10
                    }
                },
                messages:
                    {

                    cktext:{
                        required:"Please enter Text",
                        minlength:"Please enter 10 characters"


                    }
                }
            });
        });
Run Code Online (Sandbox Code Playgroud)

HTML片段是

   <form class="form-horizontal" role="form" name="f3" id="f3" >
     <div class="col-xs-8">
        <textarea class="ckeditor" name="cktext" id="cktext"></textarea>
    </div>
     <button type="submit" class="btn btn-default btn-success">Submit</button>
   </form>
Run Code Online (Sandbox Code Playgroud)

正如我在这里找到了这个答案

谢谢大家...


Ryl*_*ley 5

我采用了前面的答案,并使用实际的CKEditor对其进行了充实,以便您可以看到提交之前将CKEditor的内容复制到文本区域中需要执行的操作。

关键是:

CKEDITOR.on('instanceReady', function () {
    $.each(CKEDITOR.instances, function (instance) {
        CKEDITOR.instances[instance].document.on("keyup", CK_jQ);
        CKEDITOR.instances[instance].document.on("paste", CK_jQ);
        CKEDITOR.instances[instance].document.on("keypress", CK_jQ);
        CKEDITOR.instances[instance].document.on("blur", CK_jQ);
        CKEDITOR.instances[instance].document.on("change", CK_jQ);
    });
});

function CK_jQ() {
    for (instance in CKEDITOR.instances) {
        CKEDITOR.instances[instance].updateElement();
    }
}
Run Code Online (Sandbox Code Playgroud)

我从这个答案中得到了一个不同但相似的问题。

您遇到的另一个错误是minlength规则对象中的拼写错误。

这看起来像是在工作:http : //jsfiddle.net/ryleyb/QcJ57/