CODEWITHSUNDEEP
javascriptjqueryjquery-ui
Tom
Tom

Reputation: 520

Automatically increasing textarea size

I have following function autoheight() in jquery , which automatically enlarges the textbox according the text we input,

  $(function(){ 

  $(".form-textarea").autoheight();

  });

My issue is when I reload the page using jquery & ajax, the function stops working and the text box stops increasing the size according to the text content. I mean it is related to event delegation, can anybody find a solution for this ?

Functioning html coding of text area

   <textarea style="overflow: hidden; height: 26.234px;" name="comment" class="form-textarea"></textarea>

Text area loaded through jquery /non-functioning

  <textarea name="comment"  class="form-textarea"></textarea>

Note - it works fine, if we refresh the page through browser.

Upvotes: 0

Views: 51

Answers (1)

Rion Williams
Rion Williams

Reputation: 76597

Are you actually overriding the affected textarea element during your AJAX call?

If that is the case, you will need to explicitly call the autoheight() function on the new element within the successful callback of your AJAX call (as the older one was replaced and is no longer in the DOM and your function doesn't know about the new element).

$.ajax({ 
      url: 'your-target-here',
  success: function(){
              // Update your content here (or that may already be done)

              // Reregister your autoheight function
              $(".form-textarea").autoheight();
           }
});

Upvotes: 1

Related Questions