I am using JQuery Validate and CKEditor and I am trying to get the
CKEditor to validate code. It is not working. The validate works on all
my other form components. How do I get it working for my CKEditor
My CKEditor is iniitialised like this
CKEDITOR.replace('description', {
toolbar: [
{ name: 'basicstyles', items: [ 'Bold', 'Italic', 'Underline', '-', 'RemoveFormat' ] },
{ name: 'list', items: [ 'NumberedList', 'BulletedList' ] }
]
});
My validator uses data-rule-required on the CKEditor but it does not validate it. Here is my JQuery valadation code.
if (jQuery().validate) {
var removeSuccessClass = function(e) {
$(e).closest(‘.form-group’).removeClass(‘has-success’);
}
jQuery.validator.setDefaults({
errorElement: 'span', //default input error message container
errorClass: 'help-block', // default input error message class
errorPlacement: function(error, element) {
if(element.parent('.chosen').length){
error.insertAfter(element.parent());
}
if(element.parent('.input-group').length) {
error.insertAfter(element.parent());
} else if(element.parent('.checkbox').length){
error.insertBefore(element.parent('.checkbox'));
} else {
error.insertAfter(element);
}
},
focusInvalid: false, // do not focus the last invalid input
ignore: ':hidden:not(.chosen)', // need line to validate chosen items that are shown.
rules: {
'send_email[]': {
required: true,
minlength: 1
}
},
messages: {
'send_email[]': {
required: 'Must select at least one address',
minlength: 'Must select at least one address'
}
},
invalidHandler: function (event, validator) { //display error alert on form submit
var el = $(validator.errorList[0].element);
if ($(el).hasClass('chosen')) {
$(el).trigger('chosen:activate');
} else {
$(el).focus();
}
},
highlight: function (element) { // hightlight error inputs
$(element).closest('.form-group').removeClass('has-success').addClass('has-error'); // set error class to the control group
},
unhighlight: function (element) { // revert the change dony by hightlight
$(element).closest('.form-group').removeClass('has-error'); // set error class to the control group
setTimeout(function(){removeSuccessClass(element);}, 3000);
},
submitHandler: function(form){
$('#save').hide();
$('#saving').show();
form.submit();
}
})
$('#validation-form').validate({});
}