Я прошел через много ответов в SO, где указано, как проверить ckeditor. Например: - Jquery проверка не работает с ckeditor .
Мое требование состоит в том, чтобы проверять ckeditor только в том случае, если требуется выбрать «да». У меня есть поле для ввода текста, которое я могу подтвердить, но не в поле ckeditor.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ckeditor validation</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<style>
.error {
color: #ff0000;
font-size: 12px;
font-weight: normal;;
}
</style>
</head>
<body>
<div class="container">
<form class="form-horizontal" action="#" method="post" name="testform" id="testform">
<div class="form-group">
<label class="control-label col-sm-2" for="email">Required:</label>
<div class="col-sm-10">
<label class="radio-inline">
<input type="radio" name="optradio" id="optradio1" value="1" >Yes
</label>
<label class="radio-inline">
<input type="radio" name="optradio" id="optradio2" value="2" checked>No
</label>
</div>
</div>
<div id="testcontainer" style="display: none;">
<div class="form-group" >
<label class="control-label col-sm-2" for="txttest">test:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="txttest" placeholder="Enter test case" name="txttest" required="required">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="txtadescription">Description:</label>
<div class="col-sm-10">
<textarea name="txtadescription" id="txtadescription" ></textarea>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</div>
</form>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ckeditor/4.11.3/ckeditor.js" integrity="sha256-K4c5U3IsrfixTvjvCW/BtzDxFXkvj6MArLPEx/SbVhQ=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
<script>
$(document).ready(function() {
$("#testform").validate(
{
ignore: [],
rules: {
txttest: {
required: function(element){
return $('input[name="optradio"]:checked').val() == "1";
}
},
txtadescription:{
required: function()
{
CKEDITOR.instances.txtadescription.updateElement();
},
minlength:10
}
},
messages:
{
txtadescription:{
required:"Please enter Text",
minlength:"Please enter 10 characters"
}
}
});
$("#optradio1, #optradio2").change(function() {
var req = $('input[name="optradio"]:checked').val();
$("#testcontainer").hide();
if(req == '1') {
$("#testcontainer").show();
}
});
});
CKEDITOR.replace('txtadescription');
</script>
</body>
</html>