Hello all I am working on a project where I need to submit some HTML data to a database and then show it to the page, and I am using CKEditor 4 for that purpose
<script src="https://cdn.ckeditor.com/4.13.1/standard-all/ckeditor.js"></script>
everything is great except these 2 issues.
PENDING 1. when I put some HTML by copy-paste from word file or even if I type it and submit, the data displayed on the page has much larger spaces between the paragraphs, etc. when I do the same CKEditor 5 it works great but I can't use CKEditor 5 as I am using a plugin which is only working in version 4
SOLVED 2.when I submit the data it sends as empty HTML and if I submit it again then the data is submitted. I mean the value of textarea is not sent to the other page in first submit ever.
my code is here
<textarea name="ques" class="form-control ckeditor" placeholder="Describe the question" id='richtext' style="height: 150px;"></textarea>
//script
CKEDITOR.replace('desc', {
extraPlugins: 'mathjax',
mathJaxLib: 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML',
height: 320
});
if (CKEDITOR.env.ie && CKEDITOR.env.version == 8) {
document.getElementById('ie8-warning').className = 'tip alert';
}
Please do advice me how to fix these 2 issues. I will also post my answer if I find a solution. Thank you so much for any help.
EDIT
i fixed the data submition issue by this ajax
var richtext = document.getElementById('richtext');
CKEDITOR.replace('richtext', {
on : {
change: function ( evt ) {
$(richtext).html(evt.editor.getData());
}
},
extraPlugins: 'mathjax',
mathJaxLib: 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML',
height: 320
});
if (CKEDITOR.env.ie && CKEDITOR.env.version == 8) {
document.getElementById('ie8-warning').className = 'tip alert';
}
UPDATED problems
Point 1 as mentioned above and
New point : Point 2 got solved by adding the above code but it does when i submit the first time and then when i do not refresh the page and submits it again it sends the previous data even if i change the data in textarea.
This is what solved the issue
$(richtext).html(evt.editor.getData().replace(/(\r\n|\n|\r)/gm,"") ) ;