<script src="~/Scripts/jquery.jqGrid.min.js"></script>
<script src="~/Scripts/i18n/grid.locale-en.js"></script>
<link href="~/Content/jquery.jqGrid/ui.jqgrid.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript">
$(document).ready(function myfunction() {
jQuery('#list').jqGrid({
caption: "Employee Details",
url: '@Url.Action("GetEmployee")',
datatype: "json",
contentType: "application/json; charset-utf-8",
mtype: 'GET',
colNames: ['Id' , 'First Name', 'Last Name', 'Email Id'],
colModel: [
{ name: 'Id', index: 'Id', width: 150 },
{ name: 'First Name', index: 'FirstName', width: 150 },
{ name: 'Last Name', index: 'LastName', width: 150 },
{ name: 'Email', index: 'EmailId', width: 150 }
],
rowNum: 10,
loadonce: true
});
jQuery("#list").jqGrid('navGrid', '#pager', { edit: true, add: true, del: true });
});
</script>