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.
|
@{
List<object> commands = new List<object>();
commands.Add(new { type = "userstatus", buttonOption = new { click="click",content = "Details", cssClass = "e-flat e-details" } }); // custom
}
<div id="dialog"></div>
<ejs-grid id="Grid" allowPaging="true" load="onLoad">
<e-data-manager url="/Index?handler=DataSource" insertUrl="/Index?handler=Insert" updateUrl="/Index?handler=Update" removeUrl="/Index?handler=Delete" adaptor="UrlAdaptor"></e-data-manager>
<e-grid-editSettings allowDeleting="true" allowEditing="true" mode="Dialog"></e-grid-editSettings>
<e-grid-columns>
<e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="100"></e-grid-column>
. . .
<e-grid-column headerText="Manage Records" width="120" commands=commands>
</e-grid-column>
</e-grid-columns>
</ejs-grid>
<script>
function onLoad() {
document.getElementsByClassName('e-grid')[0].addEventListener("click", (args) => {
if (args.target.classList.contains("e-details")) {
var grid = ej.grids.parentsUntil(args.target, 'e-grid').ej2_instances[0];
var rowObj = grid.getRowObjectFromUID(ej.grids.parentsUntil(args.target, 'e-row').getAttribute('data-uid')); // getting row data
var data = rowObj.data;
var dialog = new ej.popups.Dialog({
showCloseIcon: true,
content: 'OrderID:'+data.OrderID,
header: "Show ID",
target: document.getElementsByClassName("e-grid")[0],
width: '250px'
});
// Render initialized Dialog
dialog.appendTo('#dialog');
dialog.show();
}
})
this.dataSource.dataSource.headers = [{ 'XSRF-TOKEN': $("input:hidden[name='__RequestVerificationToken']").val() }];
}
</script>
|
