
|
@Html.EJS().Grid("Grid").DataSource(dataManager => { dataManager.Url("/Home/UrlDatasource").InsertUrl("/Home/Insert").UpdateUrl("/Home/Update").RemoveUrl("/Home/Remove").Adaptor("UrlAdaptor"); }).Columns(col =>
{
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).ValidationRules(new { required = "true" }).Add();
col.Field("CustomerID").HeaderText("Customer Name").Width("150").ValidationRules(new { required = "true", minLength = 3 }).Add();
col.Field("ShipCountry").ForeignKeyField("ShipCountry").ForeignKeyValue("ShipCountry").DataSource((IEnumerable<object>)ViewBag.dataSource).HeaderText("Ship Country").ValidationRules(new { required = "true" }).Edit(new { create = "create", read = "read", destroy = "destroy", write = "write" }).Width("150").Add();
}).AllowPaging().EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true).Mode(Syncfusion.EJ2.Grids.EditMode.Normal); }).Toolbar(new List<string>
() { "Add", "Edit", "Delete", "Update", "Cancel" }).Render()
<script>
var elem;
var dObj;
var data1 = new ej.data.DataManager({
url: '/Home/UrlDatasourceDd1',
adaptor: new ej.data.UrlAdaptor(),
crossDomain: true
});
function create(args) {
elem = document.createElement('input');
return elem;
}
function write(args) {
dObj = new ej.dropdowns.DropDownList({
dataSource: data1,
value: args.rowData[args.column.field],
fields: { text: 'ShipCountry', value: 'ShipCountry' }, placeholder: 'Ship Country',
open: function (e) {
this.popupObj.element.querySelectorAll(".e-list-item")[1].classList.add("e-hide")
this.popupObj.element.querySelectorAll(".e-list-item")[3].classList.add("e-hide")
},
});
dObj.appendTo(elem);
}
function destroy() {
dObj.destroy();
}
function read(args) {
return dObj.value;
}
</script>
<style>
.e-hide {
opacity: 0.7;
pointer-events: none;
}
</style>
|