CSS:
------
<link rel="stylesheet" href="@Url.Content("~/Dojo/dojox/form/resources/CheckedMultiSelect.css")" media="screen">
Html:
------
<div id="Departments"></div>
Script
------
var departmentsStore = new Memory({
idProperty: "id",
data: []
});
@foreach (var item in Model.Departments)
{
<text>
departmentsStore.put({ type: 'options', id: '@item.DepartmentID', text: '@item.Name' });
</text>
}
var dataStore = new DataStore({
objectStore: departmentsStore,
labelProperty: "text"
});
var MyCheckedMultiSelect = declare(CheckedMultiSelect, {
startup: function () {
this.inherited(arguments);
setTimeout(lang.hitch(this, function () {
this.dropDownButton.set("label", this.label);
}));
},
_updateSelection: function () {
this.inherited(arguments);
if (this.dropDown && this.dropDownButton) {
var label = "";
array.forEach(this.options, function (option) {
if (option.selected) {
label += (label.length ? ", " : "") + option.label;
}
});
this.dropDownButton.set("label", label.length ? label : this.label);
}
}
});
var checkedDepartmentMultiSelect = new MyCheckedMultiSelect({
dropDown: true,
multiple: true,
label: "Select Departments",
store: dataStore
}, "Departments");
checkedDepartmentMultiSelect.startup();
------
<link rel="stylesheet" href="@Url.Content("~/Dojo/dojox/form/resources/CheckedMultiSelect.css")" media="screen">
Html:
------
<div id="Departments"></div>
Script
------
var departmentsStore = new Memory({
idProperty: "id",
data: []
});
@foreach (var item in Model.Departments)
{
<text>
departmentsStore.put({ type: 'options', id: '@item.DepartmentID', text: '@item.Name' });
</text>
}
var dataStore = new DataStore({
objectStore: departmentsStore,
labelProperty: "text"
});
var MyCheckedMultiSelect = declare(CheckedMultiSelect, {
startup: function () {
this.inherited(arguments);
setTimeout(lang.hitch(this, function () {
this.dropDownButton.set("label", this.label);
}));
},
_updateSelection: function () {
this.inherited(arguments);
if (this.dropDown && this.dropDownButton) {
var label = "";
array.forEach(this.options, function (option) {
if (option.selected) {
label += (label.length ? ", " : "") + option.label;
}
});
this.dropDownButton.set("label", label.length ? label : this.label);
}
}
});
var checkedDepartmentMultiSelect = new MyCheckedMultiSelect({
dropDown: true,
multiple: true,
label: "Select Departments",
store: dataStore
}, "Departments");
checkedDepartmentMultiSelect.startup();