javascript - Qualtrics:如何循环下钻结果?
问题描述
我正在尝试设置一个带有向下钻取问题的 Qualtrics 调查。在第一个下拉列表中,用户选择一位讲师,然后在第二个下拉列表中填充所选讲师提供的课程。
我需要做的是遍历第二个下拉列表中填充的所有课程(不仅仅是选定的课程,所有课程),以便为每门课程提出一个问题。当为每门课程给出答案时,调查就完成了。
我怀疑这是 Qualtrics 无法循环遍历钻取问题的问题,因此我尝试将所选讲师的所有课程通过管道传输到单独的问题(请参见下面的代码),然后循环遍历该问题。这不起作用,因为 Qualtrics 似乎无法遍历动态生成的字段。此外,无法通过界面手动创建显示逻辑,因为有 200 多名教师,每名教师都有多门课程。有任何想法吗?
谢谢!
Qualtrics.SurveyEngine.addOnload(function() {
var ddl1 = document.getElementById("QR~QID1~1"); //Instructor
var ddl2 = document.getElementById("QR~QID1~2"); //Courses
var ddl3 = document.getElementById("QR~QID2"); // Separate dropdown with results from Courses Drill Down
//jQuery("#"+this.questionId).hide();
// When user selects Instructor dropdown
ddl1.onchange = function(element) {
if (ddl1.options[ddl1.selectedIndex].text !== '') {
// Load array with courses for selected instructor
var ddl2Array = new Array();
for (i = 0; i < ddl2.options.length; i++) {
ddl2Array[i] = ddl2.options[i].text;
}
console.log(ddl2Array);
//Clear all previous items from ddl3
ddl3.options.length = 0;
// Populate ddl3 with instructor specific courses
for (var i = 1; i < ddl2Array.length; i++) {
var opt = document.createElement('option');
opt.innerHTML = ddl2Array[i];
opt.value = ddl2Array[i];
ddl3.appendChild(opt);
}
}
}
});
<div id="Questions" role="main">
<!-- rivets: if runtime.SeparatorDisplayed -->
<div id="QID1Separator" class="Separator"></div>
<div class="QuestionOuter BorderColor DD QID1" id="QID1" questionid="QID1" posttag="QID1" data-runtime-remove-class-hidden="runtime.Displayed">
<div id="QR~QID1~VALIDATION" class="ValidationError" role="alert" data-runtime-show="runtime.ErrorMsg" data-runtime-html="runtime.ErrorMsg" style="display: none;"></div>
<div id="QR~QID1~SDPVALIDATION" class="ValidationError" role="alert" data-runtime-show="runtime.PDPErrorMsg" data-runtime-html="runtime.PDPErrorMsg" style="display: none;"></div>
<div class="Inner BorderColor DL">
<div class="InnerInner BorderColor">
<fieldset>
<legend>
<div class="QuestionText BorderColor">Click to write the question text</div>
</legend>
<div class="QuestionBody">
<table role="presentation" class="ChoiceStructure" cellpadding="0" cellspacing="0">
<tbody>
<tr class="reg">
<td>
<label for="QR~QID1~1">Instructor</label>
</td>
<td>
<!-- the html binding blows aways the value binding, so do that last-->
<select class="drillDownSelectDropDown QWatchTimer" name="QR~QID1~1" id="QR~QID1~1" data-runtime-select-options="runtime.Choices.1.optionHTML" data-runtime-enabled="runtime.Choices.1.enabled" data-runtime-value="runtime.Choices.1.Value">
<option aria-label="Blank"></option>
<option value="1">Smith</option>
<option value="5">Johnson</option>
<option value="8">Baker</option>
</select>
</td>
</tr>
<tr class="alt">
<td>
<label for="QR~QID1~2">Course</label>
</td>
<td>
<!-- the html binding blows aways the value binding, so do that last-->
<select class="drillDownSelectDropDown QWatchTimer" name="QR~QID1~2" id="QR~QID1~2" data-runtime-select-options="runtime.Choices.2.optionHTML" data-runtime-enabled="runtime.Choices.2.enabled" data-runtime-value="runtime.Choices.2.Value" disabled=""></select>
</td>
</tr>
</tbody>
</table>
</div>
</fieldset>
</div>
</div>
</div>
<!-- rivets: if runtime.SeparatorDisplayed -->
<div id="QID2Separator" class="Separator"></div>
<div class="QuestionOuter BorderColor MC QID2" id="QID2" questionid="QID2" posttag="QID2" data-runtime-remove-class-hidden="runtime.Displayed">
<div id="QR~QID2~VALIDATION" class="ValidationError" role="alert" data-runtime-show="runtime.ErrorMsg" data-runtime-html="runtime.ErrorMsg" style="display: none;"></div>
<div id="QR~QID2~SDPVALIDATION" class="ValidationError" role="alert" data-runtime-show="runtime.PDPErrorMsg" data-runtime-html="runtime.PDPErrorMsg" style="display: none;"></div>
<div class="Inner BorderColor MSB">
<div class="InnerInner BorderColor">
<fieldset>
<legend>
<label class="QuestionText BorderColor" for="QR~QID2">Click to write the question text</label>
</legend>
<div class="QuestionBody">
<div class="offScreen">To select multiple options in a row, click and drag your mouse or hold down Shift when selecting. To select non-sequential options, hold down Control (on a PC) or Command (on a Mac) when clicking. To deselect an option, hold down Control or Command and click on a selected option.</div>
<select role="listbox" aria-multiselectable="true" multiple="" size="10" class="ChoiceStructure QR-QID2 QWatchTimer" name="QR~QID2[]" id="QR~QID2" data-runtime-value="runtime.Selected">
<option role="option" class="Selection" aria-selected="false" value="QR~QID2~1" id="QR~QID2~1" data-runtime-text="runtime.Choices.1.Display">Click to write Choice 1</option>
</select>
<div class="clear zero"></div>
</div>
</fieldset>
</div>
</div>
</div>
</div>
解决方案
如果我对您的理解正确,您希望响应者选择一位讲师,然后为讲师提供的每门课程回答一个问题。
如果是这种情况,您不需要下钻问题,只需使用两个多项选择题即可。我会尝试以下方法:
Q1:选择导师
Q2、Q3、...、Qn(每位讲师一个问题)- 选择一门课程。将这些问题中的每一个放在一个单独的块中。然后转到“调查流程”选项卡并添加分支逻辑:在 Q1 选择相应的讲师时显示每个块。
然后,在每个讲师特定的块上创建一个循环。
推荐阅读
- r - 根据 ui 输入选择读取 CSV
- java - 为什么 Android 的 NumberFormat 使用逗号作为澳大利亚的小数分隔符?
- sql-server - 一一更新查询
- c# - 如何创建 WPF 用户控件:自定义 TabItem?
- php - 从 Google Elevation API 获取 PHP 数组的值
- javascript - 如何从 URL.createObjectURL(file) 中检索 File 对象?
- python-3.x - 如何使用预训练的 word2vec 模型(Google)将单词列表转换为向量列表?
- html - 页脚位置固定重叠页面内容
- opengl - 使用 GL_REPEAT 重复纹理而不破坏缓存
- reactjs - 为什么在 useEffect() 内部使用时 setTimeout() 不起作用并按预期返回值?