<ej-grid id="Grid" allow-filtering="true" allow-paging="true">
<e-datamanager json="(IEnumerable<object>)ViewBag.data"
update-url="/Home/CellEditUpdate"
insert-url="/Home/CellEditInsert"
remove-url="/Home/CellEditDelete"
adaptor="remoteSaveAdaptor" />
<e-edit-settings allow-adding="true" allow-editing="true" allow-deleting="true" edit-mode="DialogTemplate" dialog-editor-template-id="#template"/>
<e-toolbar-settings show-toolbar="true" toolbar-items='@new List<string> {"add","edit","update","cancel"}' />
<e-columns>
<e-column header-text="Order ID" field="OrderID" is-primary-key="true" is-identity="true" visible="false" />
<e-column header-text="Customer ID" field="CustomerID" />
<e-column header-text="Employee ID" field="EmployeeID" />
<e-column header-text="Freight" field="Freight" format="{0:C2}" />
</e-columns>
</ej-grid>
<script type="text/template" id="template">
<b>Order Details</b>
<table cellspacing="10">
<tr>
<td style="text-align: right;">Order ID
</td>
<td style="text-align: left">
<input id="OrderID" name="OrderID" value="{{: OrderID}}" disabled="disabled" class="e-field e-ejinputtext valid e-disable"
style="text-align: right; width: 116px; height: 28px" />
</td>
<td style="text-align: right;">Customer ID
</td>
<td style="text-align: left">
<input id="CustomerID" name="CustomerID" value="{{: CustomerID}}" class="e-field e-ejinputtext valid"
style="width: 116px; height: 28px" />
</td>
</tr>
<tr>
<td style="text-align: right;">Freight
</td>
<td style="text-align: left">
<input type="text" id="Freight" name="Freight" value="{{:Freight}}" />
</td>
<tr>
<td style="text-align: right;">Employee ID
</td>
<td style="text-align: left">
<input id="ShipCity" name="ShipCity" value="{{: EmployeeID}}" class="e-field e-ejinputtext valid"
style="width: 116px; height: 28px" />
</td>
</tr>
</table>
</script>
|
public IActionResult Index()
{
BindDataSource();
ViewBag.data = order;
return View();
}
public ActionResult CellEditUpdate([FromBody]CRUDModel<Orders> value)
{
var ord = value.Value;
Orders val = order.Where(or => or.OrderID == ord.OrderID).FirstOrDefault();
val.OrderID = ord.OrderID;
val.EmployeeID = ord.EmployeeID;
val.CustomerID = ord.CustomerID;
val.Freight = ord.Freight;
val.OrderDate = ord.OrderDate;
val.ShipCity = ord.ShipCity;
return Json(value.Value);
}
public ActionResult CellEditInsert([FromBody]CRUDModel<Orders> value)
{
value.Value.OrderID =order.LastOrDefault().OrderID + 1;
order.Insert(0, value.Value);
return Json(value);
}
public ActionResult CellEditDelete([FromBody]CRUDModel<Orders> value)
{
order.Remove(order.Where(or => or.OrderID == int.Parse(value.Key.ToString())).FirstOrDefault());
return Json(value);
} |
Hi Qasim,
Thanks for Contacting Syncfusion support.
We have analyzed your requirement and we are creating the sample with Dialog Template mode with remote save adaptor.
Please find the code example.
<ej-grid id="Grid" allow-filtering="true" allow-paging="true"><e-datamanager json="(IEnumerable<object>)ViewBag.data"update-url="/Home/CellEditUpdate"insert-url="/Home/CellEditInsert"remove-url="/Home/CellEditDelete"adaptor="remoteSaveAdaptor" /><e-edit-settings allow-adding="true" allow-editing="true" allow-deleting="true" edit-mode="DialogTemplate" dialog-editor-template-id="#template"/><e-toolbar-settings show-toolbar="true" toolbar-items='@new List<string> {"add","edit","update","cancel"}' /><e-columns><e-column header-text="Order ID" field="OrderID" is-primary-key="true" is-identity="true" visible="false" /><e-column header-text="Customer ID" field="CustomerID" /><e-column header-text="Employee ID" field="EmployeeID" /><e-column header-text="Freight" field="Freight" format="{0:C2}" /></e-columns></ej-grid><script type="text/template" id="template"><b>Order Details</b><table cellspacing="10"><tr><td style="text-align: right;">Order ID</td><td style="text-align: left"><input id="OrderID" name="OrderID" value="{{: OrderID}}" disabled="disabled" class="e-field e-ejinputtext valid e-disable"style="text-align: right; width: 116px; height: 28px" /></td><td style="text-align: right;">Customer ID</td><td style="text-align: left"><input id="CustomerID" name="CustomerID" value="{{: CustomerID}}" class="e-field e-ejinputtext valid"style="width: 116px; height: 28px" /></td></tr><tr><td style="text-align: right;">Freight</td><td style="text-align: left"><input type="text" id="Freight" name="Freight" value="{{:Freight}}" /></td><tr><td style="text-align: right;">Employee ID</td><td style="text-align: left"><input id="ShipCity" name="ShipCity" value="{{: EmployeeID}}" class="e-field e-ejinputtext valid"style="width: 116px; height: 28px" /></td></tr></table></script>
Server side code.
public IActionResult Index(){BindDataSource();ViewBag.data = order;return View();}public ActionResult CellEditUpdate([FromBody]CRUDModel<Orders> value){var ord = value.Value;Orders val = order.Where(or => or.OrderID == ord.OrderID).FirstOrDefault();val.OrderID = ord.OrderID;val.EmployeeID = ord.EmployeeID;val.CustomerID = ord.CustomerID;val.Freight = ord.Freight;val.OrderDate = ord.OrderDate;val.ShipCity = ord.ShipCity;return Json(value.Value);}public ActionResult CellEditInsert([FromBody]CRUDModel<Orders> value){value.Value.OrderID =order.LastOrDefault().OrderID + 1;order.Insert(0, value.Value);return Json(value);}public ActionResult CellEditDelete([FromBody]CRUDModel<Orders> value){order.Remove(order.Where(or => or.OrderID == int.Parse(value.Key.ToString())).FirstOrDefault());return Json(value);}
For your reference we have created a sample based on your requirement and same it can be downloaded from the following location.
Please let us know if you have any concern.
Regards,K.Karthick.
Hi Qasim,
Thanks for Contacting Syncfusion support.
We have analyzed your requirement and we are creating the sample with Dialog Template mode with remote save adaptor.
Please find the code example.
<ej-grid id="Grid" allow-filtering="true" allow-paging="true"><e-datamanager json="(IEnumerable<object>)ViewBag.data"update-url="/Home/CellEditUpdate"insert-url="/Home/CellEditInsert"remove-url="/Home/CellEditDelete"adaptor="remoteSaveAdaptor" /><e-edit-settings allow-adding="true" allow-editing="true" allow-deleting="true" edit-mode="DialogTemplate" dialog-editor-template-id="#template"/><e-toolbar-settings show-toolbar="true" toolbar-items='@new List<string> {"add","edit","update","cancel"}' /><e-columns><e-column header-text="Order ID" field="OrderID" is-primary-key="true" is-identity="true" visible="false" /><e-column header-text="Customer ID" field="CustomerID" /><e-column header-text="Employee ID" field="EmployeeID" /><e-column header-text="Freight" field="Freight" format="{0:C2}" /></e-columns></ej-grid><script type="text/template" id="template"><b>Order Details</b><table cellspacing="10"><tr><td style="text-align: right;">Order ID</td><td style="text-align: left"><input id="OrderID" name="OrderID" value="{{: OrderID}}" disabled="disabled" class="e-field e-ejinputtext valid e-disable"style="text-align: right; width: 116px; height: 28px" /></td><td style="text-align: right;">Customer ID</td><td style="text-align: left"><input id="CustomerID" name="CustomerID" value="{{: CustomerID}}" class="e-field e-ejinputtext valid"style="width: 116px; height: 28px" /></td></tr><tr><td style="text-align: right;">Freight</td><td style="text-align: left"><input type="text" id="Freight" name="Freight" value="{{:Freight}}" /></td><tr><td style="text-align: right;">Employee ID</td><td style="text-align: left"><input id="ShipCity" name="ShipCity" value="{{: EmployeeID}}" class="e-field e-ejinputtext valid"style="width: 116px; height: 28px" /></td></tr></table></script>
Server side code.
public IActionResult Index(){BindDataSource();ViewBag.data = order;return View();}public ActionResult CellEditUpdate([FromBody]CRUDModel<Orders> value){var ord = value.Value;Orders val = order.Where(or => or.OrderID == ord.OrderID).FirstOrDefault();val.OrderID = ord.OrderID;val.EmployeeID = ord.EmployeeID;val.CustomerID = ord.CustomerID;val.Freight = ord.Freight;val.OrderDate = ord.OrderDate;val.ShipCity = ord.ShipCity;return Json(value.Value);}public ActionResult CellEditInsert([FromBody]CRUDModel<Orders> value){value.Value.OrderID =order.LastOrDefault().OrderID + 1;order.Insert(0, value.Value);return Json(value);}public ActionResult CellEditDelete([FromBody]CRUDModel<Orders> value){order.Remove(order.Where(or => or.OrderID == int.Parse(value.Key.ToString())).FirstOrDefault());return Json(value);}
For your reference we have created a sample based on your requirement and same it can be downloaded from the following location.
Please let us know if you have any concern.
Regards,K.Karthick.
.Columns(col =>
{
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(75).Add();
col.Field("CustomerID").HeaderText("Customer ID").Width(80).Add();
col.Field("EmployeeID").HeaderText("Employee ID").TextAlign(TextAlign.Right).Width(75).Add();
col.Field("Freight").HeaderText("Freight").TextAlign(TextAlign.Right).Width(75).Format("{0:C}").Add();
}).Render();
|
|
@{Html.EJ().Grid<Object>("FlatGrid")
.Datasource((IEnumerable<object>)ViewBag.DataSource)
.AllowPaging()
.EditSettings(edit => { edit.AllowEditing(); })
.Columns(col =>
{
col.Field("OrderID").IsPrimaryKey(true).Add();
col.Field("EmployeeID").AllowEditing(false).Add();
col.Field("Freight").Add();
col.Field("ShipCity").Add();
col.Field("ShipCountry").Add();
}).Render();
} |