Search code examples
jqueryjqte

Onchange even t call with jQuery Text Editor


I have few textareas on my page:

<div class='responsibilities'>
    <h2>The appraisee's responsibilities during the quarter:</h2>
    <textarea class='quartz_textarea' id='resp' name='resp'></textarea>    
</div>
<div class='strengths'>
    <h2>The appraisee's strengths and good qualities during the quarter:</h2>
    <textarea class='quartz_textarea' id='str' name='str'></textarea>
</div>
<div class='improve'>
    <h2>Areas in which the appraisee still has to improve:</h2>
    <textarea <?php class='quartz_textarea' id='impr' name='impr'></textarea>    
</div>
<div class='outlook '>
    <h2>Outlook on the next quarter:</h2>
    <textarea class='quartz_textarea' id='outlk' name='outlk'></textarea>    
</div>

I use jQuery text Editor and want to save text automatically inside database:

$(function () {
    $('.quartz_textarea').jqte();

    var timeoutId;
    $('textarea').on('input propertychange change', function() {
      console.log('Textarea Change');

      clearTimeout(timeoutId);
      timeoutId = setTimeout(function() {
        // Runs 1 second (1000 ms) after the last change    
        saveToDB();
      }, 1000);
    }); 
});

It works only if I remove $('.quartz_textarea').jqte(); otherwise it doesnt work. How can I fix this?


Solution

  • you may want to use the jqye change callback here

    $('.quartz_textarea').jqte({change: function(){//Your code or function call comes here }});
    

    also you can use

    focus:
    blur: