====== mcCgAccordion - Expand and collapse choice groups in a multiple choice question ======
The **mcCgAccordion** function expands and collapses choice groups in a multiple choice question. It automatically adjusts behavior for single and multi-select choice groups.

Here is a quick video demonstration:\\
{{ ::mccgaccordion.mp4?650 |mcCgAccordion Demonstration}}

Features include:
  * Option to set **[[mcCgAccordion#start|start]]** modes: collapsed, expanded, and auto
  * Auto collapses and displays selected choice for single select choice groups 
  * Compatible with **[[mccolumns|mcColumns]]** and **[[choicegroupanchorexclusive|choiceGroupAnchorExclusive]]** 

This function is available for a reasonable fee. Contact **[[https://community.qualtrics.com/inbox/conversation?with=373|TomG]]** on the Qualtrics Community to learn more.
===== Set-up Instructions =====
==== Survey Header ====
Add the mcCgAccordion function to the survey header to make it available to any question in the survey. Go to Look & Feel -> General -> Header edit -> {{::icon_source.jpg?20|}} and paste the provided mcCgAccordion function JS:
<code>
<script>/*Paste mcCgAccordion function JS here*/</script>
</code>
Alternatively, paste the mcCgAccordion function JS into a question's JS outside the existing Qualtrics functions to make it available to questions on the page.
===== Question Setup =====
==== Question Options ====
The requirements for the multiple choice question are:
  * Format: List
  * Alignment: Vertical
==== Choice Groups ====
Create [[https://www.qualtrics.com/support/survey-platform/survey-module/editing-questions/formatting-answer-choices/#AssigntoGroup|choice groups]] and assign choices to the groups. Do NOT hide the choice group titles. Set other choice group options as needed.
==== Question JavaScript ====
Add JS to call the mcCgAccordion function to apply it to the multiple choice question as follows:
<code>
Qualtrics.SurveyEngine.addOnload(function() {
	mcCgAccordion(this);
});
</code>
To override the default options, specify the desired **[[mccgaccordion#options|options]]** is the second function argument as an object. For example:
<code>
Qualtrics.SurveyEngine.addOnload(function() {
	mcCgAccordion(this,{start:"expand"});
});
</code>
===== Options =====
==== collapseText ====
**collapseText** is a string that specifies the text display to the right of the choice group label when a choice group is expanded. 

Default: %%'^'%%
==== expandText ====
**expandText** is a string that specifies the text displayed to the right of the choice group label when a choice group is collapsed.

Default: %%'˅'%%
==== start ====
**start** is a string that specifies the start mode of the choice groups. There are three valid values:
  - auto - expand the first unanswered choice group and collapse the others
  - collapse - collapse all choice groups 
  - expand - expand all choice groups

Default: %%'auto'%%
====== Qualtrics Wiki ======
[[start|Qualtrics Wiki]]