Hi Iswariya,
We analyzed your reported query and we suggest you to use Custom Command Column of Grid to customize the button in each row of Grid. Please refer to the following online sample link:
http://mvc.syncfusion.com/demos/web/grid/customcommand
We can also achieved your requirement using Template column property of Grid. Please refer to the following code example
|
@(Html.EJ().Grid<EmployeeView>("ColumnTemplate")
. . .
.ClientSideEvents(eve => {eve.TemplateRefresh("RefreshTemplate");})
.Columns(col =>
{
. . .
col.HeaderText("Details").Template("<input type = 'button' value ='Details'></input>").TextAlign(TextAlign.Center).Width(110).Add();
})
)
<script type="text/javascript">
function RefreshTemplate(args) {
$(args.cell).find("input").ejButton({
click: function (e) {
alert("Details of the Row")
}
})
}
</script>
|
And also please refer to the following online documents.
Online documents for Custom Command:
http://help.syncfusion.com/js/api/ejgrid#members:columns-commands
http://www.syncfusion.com/kb/aspnetmvc/grid?sortId=0&tags=commandbutton
http://www.syncfusion.com/kb/aspnet/grid?sortId=0&tags=commandbutton
http://www.syncfusion.com/kb/javascript/ejgrid?sortId=0&tags=command-column
Online documents for Template Column:
http://help.syncfusion.com/js/api/ejgrid#members:columns-template
http://help.syncfusion.com/js/api/ejgrid#members:columns-templateid
http://www.syncfusion.com/kb/aspnetmvc/grid?sortId=0&tags=templatecolumn
http://www.syncfusion.com/kb/aspnet/grid?sortId=0&tags=templatecolumn
Regards,
Saravanan A.
