The grid settings:
var gridSettings = {
url: '/Users/List',
datatype: “json”,
altclass: 'alternateRow', //The class that is used for alternate rows. You can construct your own class and replace this value. This option is valid only if altRows options is set to true
altRows: true, //Set a zebra-striped grid
resizeclass: “resizable”, //Assigns a class to columns that are resizable so that we can show a resize handle only for ones that are resizable
loadtext: “Loading!!”, //The text which appear when requesting and sorting data. This parameter is located in language file
loadui: “enable”, //This option controls what to do when an ajax operation is in progress.
multiselect: true, //If this flag is set to true a multi selection of rows is enabled. A new column at left side is added. Can be used with any datatype option.
multiboxonly: false, //the multiselection is done only when the checkbox is clicked (Yahoo style). Clicking in any other row (suppose the checkbox is not clicked) deselects all rows and the current row is selected
rownumbers: false, //A column is added to count the number of available rows
scroll: true,
colNames: ['userid', 'Username', 'Student', 'Email'],
colModel: [
{ name: 'Id', index: 'Id', width: 200, hidden: true },
{ name: 'UserName', index: 'UserName', width: 200 },
{ name: 'Name', index: 'Name', width: 200 },
{ name: 'Email', index: 'Email', width: 200, resizable: true }
],
sortable: true, //When enabled this option allow column reordering with mouse.