TinyMCE submits a solution where AjaxForm cannot get the data

  • 2020-05-10 17:42:21
  • OfStack

This paper analyzes the solution that TinyMCE submitted AjaxForm failed to obtain data. Share with you for your reference. The specific analysis is as follows:

Before using AjaxForm, I submitted Web form for a small comment, which used TinyMCE for text editing. In order to increase the user experience by 1 bit, AjaxForm is handy to implement Ajax submission. But one unexpected thing happened. That is, every time you submit, the first time you submit, AjaxForm will not be able to get the currently edited comment content, that is, the content in TextArea. You have to click submit once more to submit the content of TextArea.

The key is that the content on TinyMCE is not updated to TextArea before committing. Therefore, I want to see if AjaxForm has the event binding before submission. I find that in the beforeSubmit event, the content of formData has been filled. Although you can fill the content of the current TinyMCE by yourself here, it is always not a pretty solution.

In order to find out if there is any other way to solve this problem, I checked the source code of AjaxForm and found that the author of AjaxForm had proposed a unified solution for this problem. The specific source code is as follows:

1. The js code is as follows:

// hook for manipulating the form data before it is extracted;
// convenient for use with rich editors like tinyMCE or FCKEditor
var veto = {};
this.trigger('form-pre-serialize', [this, options, veto]);
if (veto.veto) {
log('ajaxSubmit: submit vetoed via form-pre-serialize trigger');
return this;
}

2. Corresponding FCKEditor is similar:
// bind form using 'ajaxForm' 
$('#commentForm').ajaxForm(options);
// The binding form-pre-serialize Event at trigger form-serilaize Save before event tinyMCE The data to the textarea In the
$('#commentForm').bind('form-pre-serialize', function(event, form, options, veto) {
tinyMCE.triggerSave();
});

I hope this article has been helpful to your javascript programming.


Related articles: