Assign css class to Multi-Line within collection

replied on June 21, 2019 • Show version history

The CSS class is being assigned, the most likely problem is that your code is only running on document ready, which means it is only acting on the elements that exist when it runs.

When you add fields/rows, your process needs to run again to update them. You can trigger it based on clicking the "Add" link, but that won't work if rows are added via lookups.

https://answers.laserfiche.com/questions/153832/Table-and-Collection-JavaScript-Event-Handlers

0 0

replied on June 24, 2019

Hi Jason,

Thanks for the reply So i am using the below to add in the autogrow. However when i click the add link on the collection this isn't applying the function to them.

$(document).ready(function () {  
  $('.expandarea textarea').each(function () {
    h(this);
  }).on('lookup change keyup', function () {
    h(this);
  }); 
  function h(e) {
    $(e).css({'height':'auto','overflow-y':'hidden'}).height(e.scrollHeight);
  }
});

Thanks

Mark

0 0

replied on June 24, 2019

That is expected.

To provide a breakdown:

Your form loads
Document "ready" fires
Your change events are assigned to the existing textarea
You click the "add button"
A new textarea is created

When you click "add" the new ones don't work specifically because they are new; basically, you haven't assigned anything to them.

Your code is written to trigger on document ready, so there's nothing that would make it run again when a new textarea is added.

What you need is a delegated event. A delegated event will be attached to the table as a whole, but with filters for the child elements.

This could be assigned once and work for all new rows you add. Check the link from my first post for an explanation/example.

0 0

Question

Question

Assign css class to Multi-Line within collection

Replies

Sign in to reply to this post.