Question

我有一个选择小部件，如下所示

var pulseLen = new Select({
    id : "_PulseLength",
    label:"PulseLength",
    name: "pulseLength",
    value : 100,
    options: [
              { label : "5", value :"5" },
              { label : "10", value :"10" },
              { label : "30", value :"30" },
              { label : "100", value :"100" },
              { label : "300", value :"300" }
              ]
        });

现在根据上面的pulseLength小部件中选择的值，我必须更改下面的Select Range小部件的选项它是GUI验证的一部分。

   var range = new Select({
          id:"_Range",
          label:"Range"),
          name: "range",
          value: "5000",
        options: [
          { label : "5", value :"5000" },
          { label : "10", value :"10000" },
          { label : "20", value :"20000" },
          { label : "40", value :"40000" },
          { label : "80", value :"80000" },
          { label : "160", value :"160000" },
          { label : "260", value :"260000" }
          ]
});

用于生成动态选项的API

 function getRangeArray(pulselen){

    var myOptions = "";
    var array = [0.5,1,2,5,10,20,40];
    console.log("Length got is " + pulselen);
    for(i=0;i<array.length;i++){
        var myTmp = "{label : '" + array[i] + "', value : '"+array[i] * 1000 + "'}";
        //console.log(myTmp);
        if(i==array.length-1){

            myOptions = myOptions + myTmp;
        }else{
            myTmp=myTmp+",";
            myOptions = myOptions + myTmp;  
        }

        //console.log(myOptions);
    }

    //console.log(myOptions);
    myOptions = "[" + myOptions + "];";
    return myOptions;
}

PulseLength的OnChange事件试图改变选项

  var newOptions = getRangeArray(value);
  console.log(newOptions);
  registry.byId("_Range").set("options", newOptions);

示例输出

[{label : '0.5', value : '500'},
 {label : '1', value : '1000'},
 {label : '2', value : '2000'},
 {label : '5', value : '5000'},
 {label : '10', value : '10000'},
 {label : '20', value : '20000'},
 {label : '40', value : '40000'}];

Answer 1

我认为这里有一些问题。就像Thomas Kagan在评论中所说，有一些拼写错误：

范围选择小部件有一个;在“值：”和a）之后“标签：范围”。

接下来，在你的getRangeArray函数中，你实际上正在构建一个字符串！这不是必需的 - 您必须使用JSON.parse解析它才有用。相反，只需直接使用对象构建数组：

function getRangeArray(pulselen){

    var myOptions = [];
    var array = [0.5,1,2,5,10,20,40];
    console.log("Length got is " + pulselen);
    for(i=0;i<array.length;i++){
        myOptions.push({label: array[i].toString(), value: "" + array[i]*1000 });
    }
    return myOptions;
}

请注意，我在标签上调用了toString()！否则dijit / form / Select会抛出一些非常奇怪的错误 - 它希望标签是字符串。

此外，虽然我不知道是否有必要，但在更新其选项后，您可能需要在reset()小部件上调用_Range：

registry.byId("_Range").set("options", newOptions).reset();

..至少你曾经如此，但现在似乎没有它。

以下是您的代码和更新后的部分：http://jsfiddle.net/ycrz1ug4/

如何为dijit.form.select小部件动态构造和设置选项？

1 个答案: