How to revalidate ckeditor fields after value enters into the fields

42 Views Asked by At

I want to revalidate the ckeditors fields using bootstrapvalidator.

Option1: {
    validators: {
        notEmpty: {
            message: 'The A is required'
        }
    }
},
Option2: {
    validators: {
        notEmpty: {
            message: 'The B is required'
        }
    }
},
Option3: {
    validators: {
        notEmpty: {
            message: 'The C is required'
        }
    }
},
Option4: {
    validators: {
        notEmpty: {
            message: 'The D is required'
        }
    }
},                    
QBQuestion: {
    validators: {
        notEmpty: {
            message: 'The QBQuestion is required and cannot be empty'
        }
    }
}

This my div code:

<div class="row form-group">
    <div class="col-lg-12">
        <lable>Question</lable>
        <textarea name="QBQuestion" id="QBQuestion" rows="10" cols="80" class="form-control"></textarea>
    </div>
</div>

<div class="row form-group">
     <div class="col-lg-3">
         <lable>A</lable>
         <textarea name="Option1" id="Option1" rows="10" cols="80" class="form-control"></textarea>
     </div>
     <div class="col-lg-3">
         <lable>B</lable>
         <textarea name="Option2" id="Option2" rows="10" cols="80" class="form-control"></textarea>
     </div>
     <div class="col-lg-3">
         <lable>C</lable>
         <textarea name="Option3" id="Option3" rows="10" cols="80" class="form-control"></textarea>
     </div>
     <div class="col-lg-3">
         <lable>D</lable>
         <textarea name="Option4" id="Option4" rows="10" cols="80" class="form-control"></textarea>
     </div>
 </div>

Here I have used bootstrapvalidator for validations. After entering some text the fields are not getting revalidated. Here I have five ckeditor fields. I need to validate all five fields if they have data.

1

There are 1 best solutions below

0
Voice Of The Rain On

Ckeditor script is hiding the text areas therefor the validation will not work, try this code in Jquery

 $(document).ready(function(){

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

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

                     minlength:10
                }
            },
            messages:
                {

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


                }
            }
        });
    });

Notice that ignore: [] is important to activate the validation.