javascript - 将新的排名顺序从“选择组排名”选定的选项延续到“ slider ”

Question

我正在研究“选择”、“分组”和“排名”问题类型，其中我想将所选的拖放选项以新的排名顺序作为以下 slider 问题的答案选项。

我设法使用 Qualtric 的“结转”功能仅显示所选选项，但它保留了旧顺序，而不是新排名顺序。

在这个 working example ，如果将选项“b”、“a”和“d”拖到 PGR 组框中， slider 选项将仅显示“a”、“b”和“d”，但按该顺序。如何让 slider 选项以新顺序显示所选选项？

我正在尝试以下方法，但卡在第 2 步。

1. 多答案复选框 -> 使用 Qualtrics 功能将选定的选项转至
2. 排名顺序 -> 结转到
3. slider ，我使用 JavaScript 将 slider 标签替换为一组已排序的选定选项(根据 2 中分配的新排名顺序)。

第 3 步使用我在 JavaScript 代码中声明的数组。

   var choicesObject = this.getQuestionInfo().Choices;
   //choices is the array of choiceids
   var choices = Object.keys(choicesObject);
   var Qno = choices.length;
   var test = ['this', 'is', 'rad'];

   for (var x = 0; x < Qno; x++) {
     var id = choices[x];
     //var y = id + 1;
     var qid = "QID12-" + id + "-label";
     document.getElementById(qid).innerHTML = test[x];
   }
// This works

但是，我还没有弄清楚如何将环境中的新排名顺序和描述保存为数组，甚至保存为嵌入数据。我尝试将其保存在二维数组中，按排名排序，然后按照指示将其保存到嵌入数据字段中 here 。

这是我在排名问题后的空白页中的代码:

   // hide next button
      $('NextButton') && $('NextButton').hide();

      // store rank in first column, description in second column of array "choice"

      // le was saved as embedded data from Rank question to inform the current code how many choices to loop through

      var le = '${e://Field/gp1length}';
      var len = parseInt(le);

      var choiceArray = [];

      // create blank 2D array containing descriptions and rank orders
      for (var x = 0; x < len; x++) {
        choiceArray[x] = [];
        for (var y = 0; y < 2; y++) {
          choiceArray[x][y] = 0;
        }
      }

      // this does not work, the array contains NaNs
      for (var x = 0; x < len; x++) {
        var y = x + 1;
        var rank = "${q://QID11/ChoiceNumericEntryValue/x" + y + "}";
        var desc = "${q://QID11/ChoiceDescription/x" + y + "}";
        choiceArray[x][0] = parseInt(rank);
        choiceArray[x][1] = desc;
      }

      // attempt to sort array by rank order column
      choiceArray = choiceArray.sort(function(a, b) {
        return a[0] - b[0];
      });

      for (var x = 0; x < len; x++) {
        var y = x + 1;
        var name = "gp1r" + y;
        Qualtrics.SurveyEngine.setEmbeddedData(name, choiceArray[x][1]);
      }

      // advance to next screen
      this.clickNextButton();

但是通过将 choice-ids 与 + 连接来检索 choiceValues 在 Qualtrics 中不起作用。更重要的是，当我使用结转功能时，choice-ids 是第一个多项选择问题的残余，因此 for 循环策略不起作用，因为它们不按顺序排列(即不是 1、2、3、4...)。

我将非常感谢任何帮助和建议!

Answer 1

您必须将排名通过管道传输到 slider 问题的 JavaScript 中，并根据排名重新排列 slider 的 slider 容器。

根据更新的问题进行更新:

您不需要中间页面或嵌入变量。没有它们将使您的响应数据保持干净。您可以将排名通过管道传输到数组中、删除 NaN、对 slider 进行排序和重新排序。 jQuery 使这变得更容易。您的 slider 问题只需一个脚本:

Qualtrics.SurveyEngine.addOnload(function() {
    var ranks = [
        {"choice":"xx1", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x1}")},
        {"choice":"xx2", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x2}")},
        {"choice":"xx3", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x3}")},
        {"choice":"xx4", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x4}")},
        {"choice":"xx5", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x5}")},
        {"choice":"xx6", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x6}")},
        {"choice":"xx7", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x7}")},
        {"choice":"xx8", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x8}")},
        {"choice":"xx9", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x9}")},
        {"choice":"xx10", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x10}")},
        {"choice":"xx11", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x11}")},
        {"choice":"xx12", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x12}")},
        {"choice":"xx13", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x13}")},
        {"choice":"xx14", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x14}")},
        {"choice":"xx15", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x15}")},
        {"choice":"xx16", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x16}")},
        {"choice":"xx17", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x17}")},
        {"choice":"xx18", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x18}")},
        {"choice":"xx19", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x19}")},
        {"choice":"xx20", "rank": parseInt("${q://QID68/ChoiceNumericEntryValue/x20}")}
    ];
    var tbody = jQuery("#"+this.questionId+" div.ChoiceStructure > table.sliderGrid > tbody");
    var cleanRanks = [];
    jQuery.each(ranks, function(index) { if(!isNaN(this["rank"])) cleanRanks.push(this); });    //remove NaNs
    cleanRanks.sort(function(a,b) { return a.rank - b.rank; }); //sort by rank
    jQuery.each(cleanRanks, function() {
        tbody.append(tbody.find("tr[choiceid="+this["choice"]+"]"));    //order sliders
    });
});

工作示例 survey .

更新2:

我更新了上面的代码以更改从数组中删除 NaN 的操作。此外，选择数量增加到 20 个。