Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

tinymce v4 jquery: how to catch onkeyup?

Tags:

tinymce-4

I'm trying to enable submit button when some form fields are filled. I've found a piece of javascript code that works, but I've a problem with textarea fiel which is tranformed by tinymce... How to catch it?

My html:

<form id="form_id1">
<fieldset>
<legend>Personal</legend>
Name: <input type="text" size="30" /><br />
Email: <input type="text" size="30" /><br />
Date of birth: <input type="text" size="10" /><br />
Address : <textarea size="30"></textarea><br />

</fieldset>
<input type="submit" value="Submit" />
</form>

My javascript:

$(document).ready(function()
{

    $('#form_id1 input:submit').attr("disabled", true);
    var textCounter = false;
    $('#form_id1 input:text, #form_id1 textarea').keyup(check_submit);

    function check_submit() {
        $('#form_id1 input:text, #form_id1 textarea').each(function()
          {
            if ($(this).val().length == 0) {
                textCounter = true;
                return false;
               }
            else {
                textCounter = false;
            }
         });

        $('#form_id1 input:submit').attr("disabled", textCounter);
    }
});

My tinymce init:

tinymce.init({
                selector: "textarea",
                language: 'fr_FR',
                image_advtab: true,
                menubar:false,
                forced_root_block: false,
                plugins: ["link","code","media","image","textcolor", "emoticons"],
                toolbar: "bold italic forecolor backcolor alignleft aligncenter alignright alignjustify link unlink image media emoticons",
             });

Thanks

like image 572
Recif Avatar asked Jun 05 '13 11:06

Recif


2 Answers

In tinymce init add:

setup: function(ed) {
    ed.on('keyup', function(e) {
        console.log('Editor contents was modified. Contents: ' + ed.getContent());
        check_submit();
    });
}

Keep in mind you might need to find your editor instance rather than the textarea to get the actual value. If you made the textarea have id="textarea-tiny-mce"

tinymce.get('textarea-tiny-mce').getContent();
like image 59
Harry Avatar answered Oct 14 '22 19:10

Harry


    window.onload = function () {
        tinymce.get('content').on('keyup',function(e){
            console.log(this.getContent().replace(/(<[a-zA-Z\/][^<>]*>|\[([^\]]+)\])|(\s+)/ig,''));
        });
    }
like image 39
wLc Avatar answered Oct 14 '22 20:10

wLc