Here is my code
$(document).ready(function () {
$('#jqgProducts').jqGrid({
url: '/Home/GridSampleData/', // url from wich data should be requested
datatype: 'json', // type of data
mtype: 'GET', // url access method type
colNames: ['userid', 'username', 'email', 'contact', 'password'],
colModel: [ // columns model
{ name: 'userId', index: 'userId', align: 'left',
editable: false },
{ name: 'username', index: 'username', align: 'left',
editable: true, edittype: 'text',
editoptions: { maxlength: 20 },
editrules: { required: true} },
{ name: 'email', index: 'email', align: 'left', editable: true,
edittype: 'text', editoptions: { maxlength: 50 },
editrules: { required: true} },
{ name: 'contact', index: 'contact', align: 'left',
editable: true, edittype: 'text',
editoptions: { maxlength: 20 }, editrules: { required: true} },
{ name: 'password', index: 'password', align: 'left',
editable: true, edittype: 'password',
editoptions: { maxlength: 20 },
editrules: { required: true} }
],
pager: $('#jqgpProducts'), // pager for grid
rowNum: 5, // number of rows per page
sortname: 'userId', // initial sorting column
sortorder: 'asc', // initial sorting direction
viewrecords: true, // we want to display total records count
width: '600', // grid width
height: 'auto' // grid height
});
});