ckeditor 问题：需要单击两次提交按钮才能提交表单

Question

这是我的验证代码，当ckeditor为空时会出现错误，但是当填充ckeditor文本区域时必须单击两次提交按钮才能提交表单。

$('#form').validate({
            ignore: [],
            rules: {
                title: {
                    required: true
                },
                description: {
                    required: true
                }
            },
            messages: {
                title: {
                    required: 'The title field is required.'
                },
                description: {
                    required: 'The description field is required.'
                }
            },
            submitHandler: function(form, event) {
                event.preventDefault();
                CKEDITOR.instances.description.updateElement();
                form.submit();
            }
        });

Answer 1

我也遇到了同样的问题，但最后我解决了。这是解决方法。第一次单击时，表单没有从 ckeditor 字段获取数据，但在第二次提交表单时收到数据。我创建了下面的代码。查看评论以获取解释

<script>
let editor;
$(function () {
//replace textField with the Id of your ckeditor field
    ClassicEditor
        .create( document.querySelector( '#textField' ) ,{
            placeholder: 'Please type your Bio Here',
        }).then(newEditor=>{
            editor = newEditor;
        })
        .catch( error => {
            console.error( error );
        } );
  });
//then get the value of the field on form submit 
document.querySelector("#yourFormId").addEventListener("submit",(e)=>{
e.preventDefault();
const ckeditorData = editor.getData();
alert(ckeditorData)
//this makes sure you are going to get the data when you click on 
//the submit button on the first time
})
</script>