Differences

This shows you the differences between two versions of the page.

--- mfcssliders [2022/09/30 13:39] – admin
+++ mfcssliders [2025/02/19 11:26] (current) – [Custom Validation] admin
@@ Line 1: / Line 1: @@
 ====== mfCsSliders - Mobile-friendly Constant Sum Sliders ======
-The **mfCsSliders** function converts a Qualtrics Slider question into a Mobile-friendly constant sum slider question. This function was created because Qualtrics constant sum sliders are **NOT** mobile-friendly. Functionality includes:
+The **mfCsSliders** function converts a Qualtrics Slider question into a Mobile-friendly constant sum slider question. This function was created because Qualtrics constant sum sliders are **NOT** mobile-friendly.
-  * Support and automatic detection of Mobile and non-Mobile Friendly
-  * Control of minimum spacing between scale labels
+Functionality includes:\\
-  * Turning display of the numeric scale on or off
+  * Optionally turn "must total" on or off
-  * Optional suppression of numeric scale minus signs
+  * Set "must total" to any amount
-  * Repeating of numeric scale
+  * Dynamic total calculation with visual indicators when equal to or over "must total" amount
-  * Highlighting of unanswered rows
+  * Supports addition of prefixes or suffixes to numeric values (%, $, etc.)
+  * Supports formatting of scale style
 Example:\\
@@ Line 14: / Line 15: @@
 ===== Set-up Instructions =====
 ==== Add Function To Survey ====
-To make the function available to all questions in the survey, copy the function to the Survey Header inside a script tag:
+Add the mfCsSliders 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 mfCsSliders function JS:
-Add the mfCsSliders 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 mfCsSliders function JS:
 <code>
 <script>/*Paste mfCsSliders function JS here*/</script>
@@ Line 31: / Line 31: @@
 <code>
 Qualtrics.SurveyEngine.addOnload(function() {
-	mfCsSliders(this,{});
+	mfCsSliders(this,{mustTotalFlag:false});
 });
 </code>
@@ Line 46: / Line 46: @@
 $e{ 100 - q://QID1/ChoiceNumericEntryValue/2 - q://QID1/ChoiceNumericEntryValue/3 }
 </code>
-When the rows of the slider are conditional through the use of carry forward or display logic, it may be necessary to use a hidden text entry question immediately after the slider question and base the slider custom validation on that question. The following code can be used to update the text entry question with the slider total:
+When the rows of the slider are conditional through the use of carry forward, display logic, or advanced randomization it may be necessary to use a hidden text entry question immediately after the slider question and base the slider custom validation on that question. The following code can be used to update the text entry question with the slider total:
 <code>
 Qualtrics.SurveyEngine.addOnload(function() {
@@ Line 63: / Line 63: @@
 **labelStyle** is an object that specifies css style of the scale labels.
-Default: {"font-weight":"bold"}
+Default: %%{"font-weight":"bold"}%%
 ==== mustTotalAmt ====
 **mustTotalAmt** is a numeric value that specifies what the constant sum must total to when **[[mfcssliders#mustTotalFlag|mustTotalFlag]]** is true.
@@ Line 75: / Line 75: @@
 **prefix** is text that is shown before numeric values.
-Default: ""
+Default: %%""%%
 ==== suffix ====
 **suffix** is text that is show after numeric values.
-Default: "%"
+Default: %%"%"%%
 ==== widths ====
-**widths** is the width of the constant sum numbers in ems. An 'em' is a wide character (i.e., M).
+**widths** is the width of the constant sum numbers in ems. An 'em' is the width of a wide character (i.e., M).
 Default: 3
 ====== Qualtrics Wiki ======
 [[start|Qualtrics Wiki]]