Question

我知道有很多关于这方面的问题，但我无法让这一切为我的生活而工作。我尝试了多种解决方案，包括this，the second answer here和this，我无法获得＆＃34;必需＆＃34;要显示的消息。当ckeditor字段为空时，表单仍然会提交。

我查看了文档here，并且能够将编辑器的内容传递给警报，但我没有足够的经验知道如何将其与验证插件集成。我花了这么多时间在这上面 - 有人可以帮忙吗？

这是我当前的代码，我创建了一个小提琴：http://jsfiddle.net/BmZ93/1/

     $('#add-job').validate({
                rules: {
                editor1: {
                    required: function() 
                    {
                    CKEDITOR.instances.editor1.updateElement();
                    }
                    }
                },
                messages: {
                Job_Title: "Required",
                Job_Location: "Required",
                jobid: "Required",
                Job_Cat: "Required",
                editor1: "Required"
                } 
        });

Answer 1

这是用这个

更新您的代码

http://jsfiddle.net/rohanppatil/BmZ93/8/

$(document).ready(function() {
$('#add-job').validate({
    ignore: [],         
    rules: {
                editor1: {
                    required: function() 
                    {
                    CKEDITOR.instances.editor1.updateElement();
                    }
                    }
                },
                messages: {
                Job_Title: "Required",
                Job_Location: "Required",
                jobid: "Required",
                Job_Cat: "Required",
                editor1: "Required"
                },
                /* use below section if required to place the error*/
                errorPlacement: function(error, element) 
                {
                    if (element.attr("name") == "editor1") 
                   {
                    error.insertBefore("textarea#editor1");
                    } else {
                    error.insertBefore(element);
                    }
                }
            });
});

希望这会有效我在JSFIDDLE中测试了这个正常工作

Answer 2

您应该更改ignore属性的值，默认情况下保存:hidden值。如CKEDITOR隐藏textarea jQuery验证不验证元素：

ignore: []

http://jsfiddle.net/BmZ93/5/

另请注意，您应该在required方法中返回布尔值，而不是。这里传递true就足够了。

required: true

这是更新的代码，它也使用errorPlacement方法为CKEDITOR包装器添加边框，您可以根据需要自定义它：

$(document).ready(function () {
    $('#add-job').validate({
        rules: {
            'editor1': {
                required: true
            }
        },
        messages: {
            Job_Title: "Required",
            Job_Location: "Required",
            jobid: "Required",
            Job_Cat: "Required",
            editor1: "Required"
        },
        errorPlacement: function(error, $elem) {
            if ($elem.is('textarea')) {
                $elem.next().css('border', '1px solid red');
            }
        },
        ignore: []
    });
});

ckeditor数据未通过jQuery验证进行验证

2 个答案: