动态填充Dojox CheckedMultiselect

时间:2013-03-18 12:28:30

标签: javascript dojo

function populateMultiSelect(optionData){
    require([
      "dojox/form/CheckedMultiSelect",
      "dojo/dom", "dojo/_base/window", "dojo/domReady!"
    ], function(CheckedMultiSelect, dom, win){

     var sel = dijit.byId('dynamic');

     var n = 0;
     for(var i in optionData){
         var c = win.doc.createElement('option');
         c.innerHTML = optionData[i];
         c.value = optionData[i];
         console.log(optionData[i]);
         sel.appendChild(c);
     }

     var myCheckedMultiSelect = new CheckedMultiSelect({
       name: 'dynamic',
       multiple: 'true'
       }, sel);

 });
}

我在optionsData

中有这些数据
  

对象{1:“QOS”,2:“ATM”,3:“软件”,4:“其他”,5:“IPv6”,6:   “管理”,7:“LAN”,8:“LAN”,9:“QOS”,10:“LAN”,11:“WAN”,12:   “安全”,13:“安全”,14:“局域网”}

为什么这不起作用。

我试图从json动态填充此字段。有人可以帮忙吗?

2 个答案:

答案 0 :(得分:0)

用于访问<select>元素的代码不正确。 dijit.byId()用于获取窗口小部件对象。但是,由于您尚未创建窗口小部件(当时),因此无法访问它。 你应该使用的是以下代码:

dojo.byId('dynamic');

如果这不起作用,您能否添加ID为dynamic的元素的HTML代码?

更新:您还可以尝试使用以下内容将它们添加到窗口小部件中:

myCheckedMultiSelect.addOption(c);

这意味着您必须在窗口小部件声明之后放置for循环,如下所示:

function populateMultiSelect(optionData){
    require([
      "dojox/form/CheckedMultiSelect",
      "dojo/dom", "dojo/_base/window", "dojo/domReady!"
    ], function(CheckedMultiSelect, dom, win){

     var sel = dojo.byId('dynamic');

     var n = 0;

     var myCheckedMultiSelect = new CheckedMultiSelect({
       name: 'dynamic',
       multiple: 'true'
       }, sel);

     for(var i in optionData){
         var c = win.doc.createElement('option');
         c.innerHTML = optionData[i];
         c.value = optionData[i];
         console.log(optionData[i]);
         myCheckedMultiSelect.addOption(c);
     }

 });
}

我还提出JSFiddle作为概念证明。

答案 1 :(得分:0)

你应该像这样使用array.forEach

function populateMultiSelect(optionData){
require([
  "dojox/form/CheckedMultiSelect",
  "dojo/dom", "dojo/_base/window", "dojo/domReady!"
], function(CheckedMultiSelect, dom, win){

 var sel = dojo.byId('dynamic');

 var n = 0;

 var myCheckedMultiSelect = new CheckedMultiSelect({
   name: 'dynamic',
   multiple: 'true'
   }, sel);

 myCheckedMultiSelect.startup();

 array.forEach(optionData, function(optionData) {
     myCheckedMultiSelect._addOptionItem(optionData);
 });

}); }