JQgrid Sorting MVC3

Question

In my CS page i have following code

   public JsonResult DynamicGridData(string sidx, string sord, int page, int rows)
    {

        Employee _emp = new Employee();

        List<Employee> _lstemp = _emp.GetallEmp();
        int pageIndex = Convert.ToInt32(page) - 1;
        int pageSize = rows;
        int totalRecords = _lstemp.Count();
        int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);


        var jsonData = new
        {
            total = totalPages,
            page,
            records = totalRecords,
            rows = (
                from emp in _lstemp
                select new
                {
                    i = emp.ID,
                    cell = new string[] { emp.ID.ToString(), emp.FirstName.ToString(), emp.LastName.ToString(),emp.Age.ToString(),emp.State.ToString(),emp.Country.ToString() }
                }).ToArray()
        };
        return Json(jsonData);
    }

My Model Is

     public class Employee
{
    public int ID { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public int Age { get; set; }
    public string State { get; set; }
    public string Country { get; set; }

    public List<Employee> GetallEmp()
    {
        List<Employee> list = new List<Employee>()
        {
            new Employee{ID=1,FirstName="Asish",LastName="Nehra",Age=25,State="A",Country="India"},
            new Employee{ID=2,FirstName="Nsish",LastName="Oehra",Age=35,State="B",Country="Sri Lanka"},
            new Employee{ID=3,FirstName="Psish",LastName="Lehra",Age=26,State="C",Country="Bangladesh"},
            new Employee{ID=4,FirstName="Jsish",LastName="Hehra",Age=25,State="D",Country="Australia"},
            new Employee{ID=5,FirstName="Usish",LastName="Tehra",Age=85,State="E",Country="Kenya"},
            new Employee{ID=6,FirstName="Rsish",LastName="Lehra",Age=15,State="F",Country="India"},
            new Employee{ID=7,FirstName="Isish",LastName="Eehra",Age=5,State="G",Country="Pakistan"},
             new Employee{ID=8,FirstName="Asish",LastName="Nehra",Age=25,State="A",Country="India"},
            new Employee{ID=9,FirstName="Nsish",LastName="Oehra",Age=35,State="B",Country="Sri Lanka"},
            new Employee{ID=10,FirstName="Psish",LastName="Lehra",Age=26,State="C",Country="Bangladesh"},
            new Employee{ID=11,FirstName="Jsish",LastName="Hehra",Age=25,State="D",Country="Australia"},
            new Employee{ID=12,FirstName="Usish",LastName="Tehra",Age=85,State="E",Country="Kenya"},
            new Employee{ID=13,FirstName="Rsish",LastName="Lehra",Age=15,State="F",Country="India"},
            new Employee{ID=14,FirstName="Isish",LastName="Eehra",Age=5,State="G",Country="Pakistan"},
             new Employee{ID=15,FirstName="Asish",LastName="Nehra",Age=25,State="A",Country="India"},
            new Employee{ID=16,FirstName="Nsish",LastName="Oehra",Age=35,State="B",Country="Sri Lanka"},
            new Employee{ID=17,FirstName="Psish",LastName="Lehra",Age=26,State="C",Country="Bangladesh"},
            new Employee{ID=18,FirstName="Jsish",LastName="Hehra",Age=25,State="D",Country="Australia"},
            new Employee{ID=19,FirstName="Usish",LastName="Tehra",Age=85,State="E",Country="Kenya"},
            new Employee{ID=20,FirstName="Rsish",LastName="Lehra",Age=15,State="F",Country="India"},
            new Employee{ID=21,FirstName="Isish",LastName="Eehra",Age=5,State="G",Country="Pakistan"},

        };
        return list;
    }
}

In my Cshtml page

<script type="text/javascript">
jQuery(document).ready(function () {

    jQuery("#list").jqGrid({
        url: '/Home/DynamicGridData/',
        datatype: 'json',
        mtype: 'POST',
        colNames: ['ID', 'FirstName', 'LastName', 'Age', 'State', 'Country'],
        colModel: [
  { name: 'ID', index: 'ID', width: 40, align: 'left' },
  { name: 'FirstName', index: 'FirstName', width: 80, align: 'left' },
  { name: 'LastName', index: 'LastName', width: 80, align: 'left' },
  { name: 'Age', index: 'Age', width: 80, align: 'left' },
  { name: 'State', index: 'State', width: 80, align: 'left' },
  { name: 'Country', index: 'Country', width: 80, align: 'left' }],
        pager: jQuery('#pager'), 
        rowNum: 10,
        rowList: [10, 20, 30],
        sortname: 'ID, FirstName, LastName, Age, State, Country',
        sortorder: "Asc",
        viewrecords: true,
        imgpath: '/content/images',
        autowidth: true,
        width: '100%',
        height: '100%',
        multiselect: false,
        caption: "Grid example",
        loadComplete: function() {
        //jQuery("#myGridID").trigger("reloadGrid"); // Call to fix client-side sorting
    }
    });

    //jQuery("#list").jqGrid('navGrid', '#pager', { add: true, edit: true, del: true });
    jQuery("#list").jqGrid('navGrid', '#pager', { edit: false, add: false, del: false }, {}, {}, {}, { multipleSearch: true, multipleGroup: true, showQuery: true });


}); 
</script>

How can i sort all the columns..I just want to sort all my fields by making sortable:true for all fields

EDIT The <script> was not correct formatted

Answer 1

In your controller you will need to use an OrderBy and then use the sidx, sord values passed to your controller by your grid. I'm also including paging in the example below so your grid can only display a page of rows from your data set.

List pagedQuery =  _lstemp.AsQueryable().OrderBy(sidx + " " + sord).Skip((page - 1) * rows).Take(rows);

In your colModel (jqGrid setup) you would set each column you want to be sortable with a property par of

sortable: false, or sortable: true

If you want everything to be sortable you could use

$.extend($.jgrid.defaults, {sortable: true});

You will be able to examine your POST to see the jqGrid telling the controller which column to sort by as well as the direction .

Note: You will need the System.Linq.Dynamic dll for this particular OrderBy syntax. This dll is available:

• As a nuget package
• On the project page