You are viewing limited content. For full access, please sign in.

Question

Question

Expand/Collapse Form Section in Script

asked on February 19, 2014

Hi,

 

  Can someone tell me the property or method to expand and collapse a form section in script?

 

Thanks

0 0

Answer

SELECTED ANSWER
replied on February 20, 2014 Show version history

You can set whether a section is collapsible or not in its settings on the Edit page and you can specify whether the section will be expanded or collapsed by default.

 

 

After that, if you want to expand or collapse sections with JavaScript, you'll need to assign the section a class via the Advanced tab of its settings, or locate its ID in the Preview Pane on the CSS and JavaScript page.

 

Here's the code that will trigger a section to toggle whether it is expanded or collapsed, assuming the section's ID is q2.

 

$('#q2 .collapsible').trigger('click');

Here's what it looks like in a working example. In this case, the code checks to see if a field's value matches "Eric" and, if it does, the code toggles the section.

$(document).ready(function () {
  $('#q3 input').blur(function () {
  if ($('#q3 input').val() == 'Eric')
  {
    $('#q2 .collapsible').trigger('click');
  }
  });
});

Note that you can also use the .show() and .hide() methods in jQuery to hide and show aspects of a form.

1 0
replied on February 20, 2014

Hi Eric,

 

  Thanks!

$('#q2 .collapsible').trigger('click');

 Is exactly what I needed.

0 0
replied on February 20, 2014

You're welcome!

0 0

Replies

replied on February 20, 2014

Eric,

 

Is one able to do something similar with adding and removing a row from a repeatable table or collection?

0 0
replied on February 20, 2014

Yes, you can trigger a click on the add button for a repeatable collection or table. You can target those elements directly by using the ID attribute shown in the Preview Pane on the CSS and JavaScript page.

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.