如何使用格式化工具向我的ComboBox添加道场DataGrid？我从我一直在阅读的内容中想到，我应该能够使用ComboBox向DataGrid添加一个道场formatter，就像我使用道场CheckBox一样}（和我创建的另一个html页面上的dojo Button）。我找不到一个很好的例子。我正在使用Dojo 1.10.0。
以下是我现有的代码，由于我的formatterCombobox格式化程序出现问题，因此无法加载：
<!DOCTYPE html>
<html >
<head>
<title>Test Widget</title>
<link rel="stylesheet" type="text/css" href="dojo-release-1.10.0/dijit/themes/claro/claro.css" />
<link rel="stylesheet" type="text/css" href="css/dojomod.css" />
<link rel="stylesheet" href="dojo-release-1.10.0/dojo/resources/dojo.css" />
<link rel="stylesheet" href="dojo-release-1.10.0/dojox/grid/resources/claroGrid.css" />
<script>dojoConfig = {async: true, parseOnLoad: false}</script>
<script src="dojo-release-1.10.0/dojo/dojo.js"></script>
<script>
require(['dojox/grid/DataGrid', 'dojo/data/ItemFileReadStore', 'dijit/form/CheckBox', 'dojo/domReady!'],
function(DataGrid, ItemFileReadStore, CheckBox){
function formatter(){
var w = new CheckBox({
label: "Use Input",
onClick: function() {
alert("CheckBox - Checked! (or unchecked!)");
}
});
w._destroyOnRemove=true;
return w;
function formatterCombobox(){
var combobox = new ComboBox({
label: "Combo",
onClick: function() {
alert("CheckBox - Checked! (or unchecked!)");
}
});
combobox._destroyOnRemove=true;
return combobox;
}
}
var layout = [
{name: 'Feed', field: 'feed'},
{name: 'Mission', field: 'mission', width: 6.5,
styles: 'text-align: center; height: 21px;'},
{name: 'Mission Override', field: 'missionoverride', width: 6.5,
formatter: formatter, /*Custom format, add a CheckBox. */
styles: 'text-align: center;'
},
{name: 'OpMode', field: 'opmode', width: 6.5,
styles: 'text-align: center; height: 21px;'},
{name: 'OpMode Override', field: 'opmodeoverride', width: 6.5,
formatter: formatter, /*Custom format, add a CheckBox. */
styles: 'text-align: center; height: 21px;'
},
{name: 'Platform', field: 'platform', width: 6.5,
styles: 'text-align: center; height: 21px;'},
{name: 'Tail Number', field: 'tailnumber', width: 6.5,
styles: 'text-align: center; height: 21px;'
},
{name: 'Producer Org', field: 'producerorg', width: 6.5,
styles: 'text-align: center; height: 21px;'
},
];
var store = new ItemFileReadStore({
data: {
identifier: "feed",
items: [
{feed: '1. feed1', mission: 'mission1', override: '', mode: '', override: '', platform: '', number: '236', org: 'SA'},
{feed: '2. feed2', mission: 'mission2', override: '', mode: '', override: '', platform: '', number: '980', org: 'SA'},
{feed: '3. feed3', mission: 'mission3', override: '', mode: '', override: '', platform: '', number: '731', org: 'SA'},
{feed: '4. feed4', mission: 'mission4', override: '', mode: '', override: '', platform: '', number: '415', org: 'SA'},
{feed: '5. feed5', mission: 'mission5', override: '', mode: '', override: '', platform: '', number: '899', org: 'SA'},
]
}
});
require([
"dojo/store/Memory", "dijit/form/ComboBox", "dojo/domReady!"
], function(Memory, ComboBox){
var stateStore = new Memory({
data: [
{name:"Alabama", id:"AL"},
{name:"Alaska", id:"AK"},
{name:"American Samoa", id:"AS"},
{name:"Arizona", id:"AZ"},
{name:"Arkansas", id:"AR"},
{name:"Armed Forces Europe", id:"AE"},
{name:"Armed Forces Pacific", id:"AP"},
{name:"Armed Forces the Americas", id:"AA"},
{name:"California", id:"CA"},
{name:"Colorado", id:"CO"},
{name:"Connecticut", id:"CT"},
{name:"Delaware", id:"DE"}
]
});
var comboBox = new ComboBox({
id: "stateSelect",
name: "state",
value: "California",
store: stateStore,
searchAttr: "name"
}, "stateSelect").startup();
});
var grid = new DataGrid({
id: 'grid',
store: store,
structure: layout,
autoWidth: true,
autoHeight: true
});
grid.placeAt('gridContainer');
grid.startup();
});
</script>
</head>
<body class="claro">
<div id="gridContainer" style="width: 100%; height: 200px;"></div>
</body>
</html>
答案 0 :(得分：2)
<script>
require(['dojox/grid/DataGrid', 'dojo/data/ItemFileReadStore', 'dijit/form/CheckBox', "dijit/form/ComboBox", 'dojo/domReady!'],
function (DataGrid, ItemFileReadStore, CheckBox, ComboBox) {
function formatter() {
var w = new CheckBox({
label: "Use Input",
onClick: function () {
alert("CheckBox - Checked! (or unchecked!)");
}
});
w._destroyOnRemove = true;
return w;
}
function formatterCombobox() {
var combobox = new ComboBox({
label: "Combo",
onClick: function () {
alert("CheckBox - Checked! (or unchecked!)");
}
});
combobox._destroyOnRemove = true;
return combobox;
}
var layout = [
{name: 'Feed', field: 'feed'},
{name: 'Mission', field: 'mission', width: 6.5,
styles: 'text-align: center; height: 21px;'},
{name: 'Mission Override', field: 'missionoverride', width: 6.5,
formatter: formatter, /*Custom format, add a CheckBox. */
styles: 'text-align: center;'
},
{name: 'OpMode', field: 'opmode', width: 6.5,
styles: 'text-align: center; height: 21px;'},
{name: 'OpMode Override', field: 'opmodeoverride', width: 6.5,
formatter: formatter, /*Custom format, add a CheckBox. */
styles: 'text-align: center; height: 21px;'
},
{name: 'Platform', field: 'platform', width: 6.5,
formatter: formatterCombobox,
styles: 'text-align: center; height: 21px;'},
{name: 'Tail Number', field: 'tailnumber', width: 6.5,
styles: 'text-align: center; height: 21px;'
},
{name: 'Producer Org', field: 'producerorg', width: 6.5,
formatter: formatterCombobox,
styles: 'text-align: center; height: 21px;'
},
];
var store = new ItemFileReadStore({
data: {
identifier: "feed",
items: [
{feed: '1. feed1', mission: 'mission1', override: '', mode: '', override: '', platform: '', number: '236', org: 'SA'},
{feed: '2. feed2', mission: 'mission2', override: '', mode: '', override: '', platform: '', number: '980', org: 'SA'},
{feed: '3. feed3', mission: 'mission3', override: '', mode: '', override: '', platform: '', number: '731', org: 'SA'},
{feed: '4. feed4', mission: 'mission4', override: '', mode: '', override: '', platform: '', number: '415', org: 'SA'},
{feed: '5. feed5', mission: 'mission5', override: '', mode: '', override: '', platform: '', number: '899', org: 'SA'},
]
}
});
require([
"dojo/store/Memory", "dijit/form/ComboBox", "dojo/domReady!"
], function (Memory, ComboBox) {
var stateStore = new Memory({
data: [
{name: "Alabama", id: "AL"},
{name: "Alaska", id: "AK"},
{name: "American Samoa", id: "AS"},
{name: "Arizona", id: "AZ"},
{name: "Arkansas", id: "AR"},
{name: "Armed Forces Europe", id: "AE"},
{name: "Armed Forces Pacific", id: "AP"},
{name: "Armed Forces the Americas", id: "AA"},
{name: "California", id: "CA"},
{name: "Colorado", id: "CO"},
{name: "Connecticut", id: "CT"},
{name: "Delaware", id: "DE"}
]
});
var comboBox = new ComboBox({
id: "stateSelect",
name: "state",
value: "California",
store: stateStore,
searchAttr: "name"
}, "stateSelect").startup();
});
var grid = new DataGrid({
id: 'grid',
store: store,
structure: layout,
autoWidth: true,
autoHeight: true
});
grid.placeAt('gridContainer');
grid.startup();
});
</script>