We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
|
<template>
<div>
<ejs-grid :dataSource="data" height="auto" width="540" :toolbar="toolbar" :pageSettings="pageSettings" allowPaging="true" :editSettings="editSettings">
<e-columns>
. . . . .
</e-columns>
</ejs-grid>
</div>
</template> |
|
export default Vue.extend({
data: () => {
return {
pageSettings: { pageSize: 12 },
toolbar: ['Add', 'Edit', 'Delete', 'Update', 'Cancel'],
editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true },
data: new DataManager({
url: "Home/UrlDatasource",
updateUrl: "Home/Update",
insertUrl: "Home/Insert",
removeUrl: "Home/Delete",
adaptor: new UrlAdaptor()
}),
};
},
. . . . . .
}); |
|
public IActionResult UrlDatasource([FromBody]DataManagerRequest dm)
{
IEnumerable DataSource = OrdersDetails.GetAllRecords();
List<string> str = new List<string>();
DataOperations operation = new DataOperations();
. . . . .
int count = DataSource.Cast<OrdersDetails>().Count();
if (dm.Skip != 0)
{
DataSource = operation.PerformSkip(DataSource, dm.Skip); //Paging
}
if (dm.Take != 0)
{
DataSource = operation.PerformTake(DataSource, dm.Take);
}
return dm.RequiresCounts ? Json(new { result = DataSource, count = count }) : Json(DataSource);
}
public ActionResult Update([FromBody]ICRUDModel<OrdersDetails> value)
{
var ord = value.value;
OrdersDetails val = OrdersDetails.GetAllRecords().Where(or => or.OrderID == ord.OrderID).FirstOrDefault();
val.OrderID = ord.OrderID;
. . . . . .
return Json(value.value);
}
//insert the record
public ActionResult Insert([FromBody]ICRUDModel<OrdersDetails> value)
{
OrdersDetails.GetAllRecords().Insert(0, value.value);
return Json(value.value);
}
//Delete the record
public ActionResult Delete([FromBody]ICRUDModel<OrdersDetails> value)
{
OrdersDetails.GetAllRecords().Remove(OrdersDetails.GetAllRecords().Where(or => or.OrderID == int.Parse(value.key.ToString())).FirstOrDefault());
return Json(value);
} |
|
class CustomAdaptor extends ej.data.UrlAdaptor {
insert(dm, data, tableName) { // you can customize and send the request based on your requirement
this.updateType = 'add';
return {
url: dm.dataSource.insertUrl || dm.dataSource.crudUrl || dm.dataSource.url,
data: $.param({
//Added the anti-forgery token.
__RequestVerificationToken: document.getElementsByName("__RequestVerificationToken")[0].value,
value: data,
table: tableName,
action: 'insert'
}),
contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
};
}
update(dm, keyField, value, tableName) {
this.updateType = 'update';
this.updateKey = keyField;
return {
type: 'POST',
url: dm.dataSource.updateUrl || dm.dataSource.crudUrl || dm.dataSource.url,
data: $.param({
//Added the anti-forgery token.
__RequestVerificationToken: document.getElementsByName("__RequestVerificationToken")[0].value,
value: value,
action: 'update',
keyColumn: keyField,
key: value[keyField],
table: tableName
}),
contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
};
}
remove(dm, keyField, value, tableName) {
new ej.data.JsonAdaptor.prototype.remove(dm, keyField, value);
return {
type: 'POST',
url: dm.dataSource.removeUrl || dm.dataSource.crudUrl || dm.dataSource.url,
data: $.param({
//Added the anti-forgery token.
__RequestVerificationToken: document.getElementsByName("__RequestVerificationToken")[0].value,
key: value,
keyColumn: keyField,
table: tableName,
action: 'remove'
}),
contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
};
}
}
|
