<ejs-grid id="Grid" dataSource="@ViewBag.data" allowPaging="true" toolbar="@( new List<object>() {"Add","Edit","Delete","Update","Cancel"})">
...
<e-grid-columns>
<e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="120"></e-grid-column>
<e-grid-column field="CustomerID" headerText="Customer ID" textAlign="Right" width="120" edit="@(new {create = "onCreate", read = "onRead", write = "onWrite", destroy= "onDestroy"})"></e-grid-column>
...
</e-grid-columns>
</ejs-grid>
<script>
var multiSelectEle;
var element
function onCreate(args) {
element = document.createElement('input');
return element;
}
function onRead(e) {
return multiSelectEle.value;
}
function onDestroy() {
multiSelectEle.destroy();
}
function onWrite(args) {
multiSelectEle = new ej.dropdowns.MultiSelect({ //rendering multiSelectEle component
dataSource: @Html.Raw(Json.Serialize(@ViewBag.dropData)),
fields: { value: "CustomerID", text:"CustomerID"}
});
multiSelectEle.appendTo(element);
}
</script> |