javascript - disable/enable button with tinymce -


i want disable button when there no content in tinymce , enable button when there content in tinymce. try this:

tinymce.init({     // general options     mode: "specific_textareas",     editor_selector: "mceeditor" });  tinymce.triggersave(); var hallo = $('#generatepdfmailformsubmitter').val(); if ($.trim(hallo.value) == "") {     $('#btngeneratepdfmailproducthandler').attr("disabled", true); } else     $('#btngeneratepdfmailproducthandler').attr("disabled", false); 

but when there no content button still visible.

thank you

i have this:

@section scripts {      @scripts.render("~/bundles/xforms_" + statehelper.getcurrentculturename())     @scripts.render("~/bundles/jqueryval")      <script type="text/javascript" src="~/js/tinymce/tinymce.min.js"></script>     <script type="text/javascript" src="~/js/mailmessage.js"></script>      <script>         var generatepdfpreviewurl = "@url.action("generatepdffromhtml", "product")";          (function ($) {             $(function () {                  $("input.datepicker").each(function () {                     var inp = $(this);                     inp.datepicker({                         dateformat: "@viewhelper.getjslocaledateformat()",                         onclose: function () {                             $(this.form).validate().element(this);                         }                     });                 });             })         })(jquery);          $(document).ready(function () {             tinymce.init({                 mode: "specific_textareas",                 editor_selector: "mceeditor",                 setup: function (ed) {                     ed.on("keyup", function () {                         onchangehandler(ed);                     })                 }             });                function onchangehandler(inst) {                 tinymce.onchangehandler(ed);                 var editorcontent = tinymce.get('generatepdfmailformsubmitter').getcontent();                 if ($.trim(editorcontent) == '') {                     alert(editorcontent);                     $('#btngeneratepdfmailproducthandler').attr('disabled', true);                 } else {                     alert(editorcontent);                     $('#btngeneratepdfmailproducthandler').attr('disabled', false);                 }             }         });        </script> } 

but doesnt hit function onchangehandler(ed) {

tinymce provides setup option detect change events in editor, can implement :

tinymce.init({     mode : "specific_textareas",     editor_selector : "mceeditor",     setup: function (ed) {     ed.on("change", function () {         onchangehandler(ed);   //<-- our handler         })     } }); 

now function onchangehandler called every time tinymce editor's contents changed. that's can check if editor empty or not , thus, set button disabled or otherwise.

function onchangehandler(inst) {     var editorcontent = tinymce.get('mytextarea').getcontent()     if ($.trim(editorcontent) == '') {         $('#btngeneratepdfmailproducthandler').attr('disabled', true);     } else {         $('#btngeneratepdfmailproducthandler').attr('disabled', false);     } } 

here working demo

update

as observed tinymce's change event requires click trigger, can use keyup trigger event handler :

setup: function (ed) {     ed.on('keyup', function(e) {         onchangehandler(ed);     }); } 

here updated working demo


Comments