{"id":16,"date":"2023-08-25T17:32:29","date_gmt":"2023-08-25T17:32:29","guid":{"rendered":"\/\/api.jquerymobile.com\/1.3\/?p=16"},"modified":"2023-08-25T17:32:29","modified_gmt":"2023-08-25T17:32:29","slug":"collapsibleset","status":"publish","type":"post","link":"https:\/\/api.jquerymobile.com\/1.3\/collapsibleset\/","title":{"rendered":"Collapsible set Widget"},"content":{"rendered":"

\nCollapsible set Widget<\/span>version added: 1.0<\/span>\n<\/h2>\n
\n

Description: <\/strong>Creates a collapsible set of collapsible blocks of content<\/p>\n

QuickNavExamples<\/a>\n<\/h2><\/header>
\n

Options<\/h3>\n
collapsedIcon<\/a><\/div>\n
corners<\/a><\/div>\n
expandedIcon<\/a><\/div>\n
iconpos<\/a><\/div>\n
initSelector<\/a><\/div>\n
inset<\/a><\/div>\n
mini<\/a><\/div>\n
theme<\/a><\/div>\n<\/div>\n
\n

Methods<\/h3>\n
refresh<\/a><\/div>\n<\/div>\n
\n

Events<\/h3>\n
create<\/a><\/div>\n<\/div><\/section>
\n\t\t

Collapsible sets start with the exact same markup as individual collapsibles.\n\t\tBy adding a parent wrapper with a data-role="collapsible-set"<\/code> attribute around a number of collapsibles, the framework will style these to looks like a visually grouped widget and make it behave like an accordion so only one section can be open at a time.<\/p>\n\t\t

By default, all the sections will be collapsed. To set a section to be open when the page loads, add the data-collapsed="false"<\/code> attribute to the heading of the section you want expanded.<\/p>\n\n

\n\t\n\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t
1<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
2<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
3<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
4<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
5<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
6<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
7<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
8<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
9<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
10<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
11<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
12<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t
13<\/div>\n\t\t\t\t\t\n\t\t\t\t<\/td>\n\t\t\t\t\n\t\t\t\t
\n\t\t\t\t\t
<div<\/span> data-role<\/span>="collapsible-set"<\/span>><\/span><\/code><\/div><\/div>
 <\/code><\/div><\/div>
  <div<\/span> data-role<\/span>="collapsible"<\/span> data-collapsed<\/span>="false"<\/span>><\/span><\/code><\/div><\/div>
    <h3<\/span>><\/span>Section 1<\/h3<\/span>><\/span><\/code><\/div><\/div>
    <p<\/span>><\/span>I'm the collapsible set content for section 1.<\/p<\/span>><\/span><\/code><\/div><\/div>
  <\/div<\/span>><\/span><\/code><\/div><\/div>
 <\/code><\/div><\/div>
  <div<\/span> data-role<\/span>="collapsible"<\/span>><\/span><\/code><\/div><\/div>
    <h3<\/span>><\/span>Section 2<\/h3<\/span>><\/span><\/code><\/div><\/div>
    <p<\/span>><\/span>I'm the collapsible set content for section 2.<\/p<\/span>><\/span><\/code><\/div><\/div>
  <\/div<\/span>><\/span><\/code><\/div><\/div>
 <\/code><\/div><\/div>
<\/div<\/span>><\/span><\/code><\/div><\/div><\/pre>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/tbody>\n\t<\/table>\n<\/div>\n\n\n\t\t
Here is an example of a collapsible set with 5 sections.\n\t\t