Error mwssage of use laravel-jsvalidation plugin does not work with tinyMCE

Question

In my Laravel 5.7 application I use laravel-jsvalidation plugin( https://github.com/proengsoft/laravel-jsvalidation/wiki/Basic-Usage ) and it worked ok, including textarea inputs, as :

<div class="form-row mb-3 {{ in_array('description', $errorFieldsArray) ? 'validation_error' : '' }}">
    <label class="col-xs-12 col-sm-4 col-form-label">Description</label>
    <div class="col-xs-12 col-sm-8">
        {{ Form::textarea('description', isset($vote->description) ? $vote->description : '', [   "class"=>"form-control editable_field textarea_input ", "rows"=>"5", "cols"=> 120, "placeholder"=>"Enter string description in 255 characters.", "id"=>"description", "autocomplete"=>"off"  ] ) }}
    </div>
</div>

But after I added tinyMCE for textarea input I got a problem, that as description is required I do not see error message on validation failure for textarea input. The source of tinyMCE input is rather complicated https://imgur.com/a/nMDq0mY and I have no idea how to fix it. 1) If there is a way ?

2) If laravel-jsvalidation plugin has some javascript event methods, like on validation failure ? That could be useful...

Thanks!

Michael Fromin Michael Fromin · Accepted Answer · 2018-11-02T14:10:05

When TinyMCE is injected into the page the original form element (e.g. <textarea>) is no longer visible. If you use your browser tools you will see that TinyMCE injects a series of <div>s and an <iframe> effectively hiding your <textarea>.

Because of this, if you ask a validation tool to look at the value in the <textarea> it likely still has its initial value from when you first loaded TinyMCE.

In order to have your validation tool validate the underlying <textarea> you first have to update the <textarea> with the current contents of TinyMCE. To do this you need to use TinyMCE's triggerSave() API. This will force TinyMCE to immediately update the underlying <textarea> with the current value in the editor. At that point your validation tooling will know what content exists in the editor.

Error mwssage of use laravel-jsvalidation plugin does not work with tinyMCE

1 Answers