CODEWITHSUNDEEP
jquery
ANIK ISLAM SHOJIB
ANIK ISLAM SHOJIB

Reputation: 3248

i can not set Textarea empty

I am working with emoticon. I just want to set value on textarea after setting it empty. But it is not working. My code is here, 

$('.tooltiptext .emoticon').click(function() {
      $in = $(this);
      console.log($in);
      setTimeout(function() {
          var dataText = $("#text").val();
          $('#text').append(dataText + $.emoticons.replace($in.html()));
          var dataCode = $in.context.innerText;
          console.log(dataCode);
          var dataTextArea = $("textarea").val();
          console.log(dataTextArea + dataCode);
          //$('#textarea').html('');
          $('#textarea').empty();// it not working
          console.log($('#textarea').val());
          $('#textarea').append(dataTextArea + dataCode + ' ');

      }, 100);

  });

  $('textarea').on('keypress', function(e) {

      if (e.which == 32 || e.which == 8) {
          $in = $(this);
          setTimeout(function() {
              $("#text").html($.emoticons.replace($in.val()));
          }, 100);
      }

  });

Upvotes: 1

Views: 173

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337560

Use val(), not text(), html() or empty(), to clear the value of a textarea:

$('#textarea').val('');

Similarly, use it to set the value, not append():

$('#textarea').val(dataTextArea + dataCode + ' ');

The same is also true of your #text element - assuming it's an input or textarea. A simplified version of your code would be this:

$('.tooltiptext .emoticon').click(function() {
    $in = $(this);

    setTimeout(function() {
        $('#text').val(function(i, v) {
            return v + $.emoticons.replace($in.html());
        });

        $('#textarea').val(function(i, v) {
            return v + $in.context.innerText + ' ';
        });
    }, 100);
});

Upvotes: 3

Related Questions