0

I have declared this in my jqgrid with 'json' data:

sortname: 'CascadeId',
sortorder: 'asc',
sortable: true,

But Sorting button has no effect. I have implemented server side sorting with asp. but button is not working. Can you indicate how to enable the button?

Update: Initial GET Request:

http://localhost/myHandler.ashx?_search=false&nd=1361795033464&rows=20&page=1&sidx=CascadeId&sord=asc

ColModel:

colModel: [ { name: 'CascadeId', index: 'CascadeId', width: 85, sortable: true, editable: true, editrules: { custom: true, custom_func: validateCascadeID, required: true} }, { name: 'VenuProfile', index: 'VenuProfile', width: 150, sortable: false, editable: true, edittype: 'select', editoptions: { value: VenuProfile, width: 90, align: 'left'} }, { name: 'Location', index: 'Location', width: 210, sortable: false, editable: true }, ]

soham
  • 1,508
  • 6
  • 30
  • 47
  • Can you post your colModel and the server params or URL you see in the firefox console – Kris Feb 25 '13 at 12:20
  • So you can see above that your `sidx` is set to CascadeId, and your `sord` is asc, are you changing the dataset sort on your server before you ship the data back to the jqGrid? – Mark Feb 25 '13 at 13:01
  • Actually when I am clcking the button then no POST or GET request is happening in Firebug. – soham Feb 25 '13 at 13:05

1 Answers1

1

If you see the sort information going out in the POST sidx & sord and you are recieving those values on the server (again sidx & sord) you would then need to do an equivalent order by on your server fetch of the data.

Ex in C# the order by and then paging request of the data would look something like:

var pagedQuery = dataset.OrderBy(sidx + " " + sord).Skip((page - 1) * rows).Take(rows);

Edit A portion of one of my working grids that starts out with a sort on the DateTimeMail' column indesc` order.

Client Side:

        $('#Mailbox').jqGrid({
            datatype: 'json',
            url: '/Mail/MailboxGetGridData',
            mtype: 'POST',
            autoencode: true,
            postData: { Mailbox: 'Inbox' },
            colNames: ['IdMail', 'From', 'To', 'Date / Time', 'Subject', 'Message', 'HasBeenRead'],
            colModel: [
                { name: 'IdMail', index: 'IdMail', width: 95, align: 'center', sortable: false, hidden: true, editable: false },
                { name: 'IdSender', index: 'IdSender', width: 150, align: 'center', sortable: true, firstsortorder: 'desc', hidden: false, editable: false },
                { name: 'IdRecipient', index: 'IdRecipient', width: 150, align: 'center', sortable: true, firstsortorder: 'desc', hidden: false, editable: false },
                { name: 'DateTimeMail', index: 'DateTimeMail', width: 150, align: 'center', sortable: true, firstsortorder: 'desc', hidden: false, editable: false },
                { name: 'Subject', index: 'Subject', width: 250, align: 'left', sortable: false, hidden: false, editable: false },
                { name: 'Message', index: 'Message', width: 150, align: 'center', sortable: false, hidden: true, editable: false },
                { name: 'HasBeenRead', index: 'HasBeenRead', width: 150, align: 'center', sortable: false, hidden: true, editable: false },
            ],
            pager: $('#MailboxPager'),
            rowNum: 5,
            rowList: [5, 10, 20, 50],
            sortname: 'DateTimeMail',
            sortorder: "desc",
....

Server side:

    public ActionResult MailboxGetGridData(string sidx, string sord, int page, int rows, bool _search, string filters)
{
  .....
  var pagedQuery = filteredQuery.OrderBy(sidx + " " + sord).Skip((page - 1) * rows).Take(rows);
  var jsonData = new
            {
                total = (totalRecords + rows - 1) / rows,
                page = page,
                records = totalRecords,
                rows = (
                    from item in pagedQuery.ToList()
                    select new
                    {
                        cell = new string[] {
                            item.IdMail.ToString(),
                            HelperClasses.HelperMethods.getUserName(item.IdSender),
                            HelperClasses.HelperMethods.getUserName(item.IdRecipient),
                            ((DateTime)item.DateTimeMail).ToString("g"),
                            item.Subject,
                            item.Message,
                            (Mailbox == "Inbox") ? item.HasBeenRead.ToString() : "True"
                        }
                    }).ToArray()
            };

            return Json(jsonData, JsonRequestBehavior.AllowGet);
Mark
  • 3,123
  • 4
  • 20
  • 31
  • My entire sorting button has no effect whatsoever. I have taken sord and sidx properly and sorted them. Can you tell me if any method is called when sorting button is clicked then I can debug if at all the button is active or not. – soham Feb 25 '13 at 12:00
  • Also, when I click the sorting button, the direction is also not changing itself. – soham Feb 25 '13 at 12:18
  • Sorting button? Do you not just click on the column header and does that click event not trigger a POST from your jqGrid? – Mark Feb 25 '13 at 12:59
  • I am not sure. If it's a post request. then how can I get back the data? – soham Feb 25 '13 at 13:02
  • But leave that. Even if I click the button, nothing is happening. No POST request or GET request! :\ – soham Feb 25 '13 at 13:03
  • When you click on a column header you would see via Firebug or Chrome where your jqGrid will send a POST to the server with a `sidx` & `sord`, these are also set in your intial jqGrid setup as you indicated above. You need to then change the order and of your dataset based on these parameters. – Mark Feb 25 '13 at 13:04
  • Well which column are you clicking on, you have some set to `sortable: false` – Mark Feb 25 '13 at 13:04
  • Only for one `sortable:true` is there and only sorting button is coming for that and I am clicking only that one. – soham Feb 25 '13 at 13:06
  • I guess as I stated above, even in your intial fetch via a POST from the jqGrid you should be seeing the `sidx`, `sord` go out to your server, and it looks like you are, you need to handle it on your server side. You should also see this behavior when clicking on the column headers. If not verify that the columns are set to sortable and that your grid is configured properly. – Mark Feb 25 '13 at 13:41
  • Can you give me a demo configuration with json server side sorting. I have no clue what I have missed. There's only one sortable but it's not POSTing anything. – soham Feb 25 '13 at 13:43
  • But if I set mType: POST then will I get the first query by GET? – soham Feb 25 '13 at 14:03
  • http://stackoverflow.com/questions/10969974/should-i-be-using-post-or-get-when-retrieving-json-data-into-jqgrid-in-my-asp-ne – Mark Feb 25 '13 at 14:26
  • Okay. Got it. So I have to set `mtype: 'POST'` to make the sorting functionality working. So, there is no way to `mtype: 'GET'` and sorting functionality working? – soham Feb 26 '13 at 08:06
  • And it's a little confusing why does the sorting function is working with `POST` because we are not sending any data to server that time. We just want to receive the sorted result. So it's very intuitive to use `GET` in spite of `POST`. – soham Feb 26 '13 at 08:08
  • I have tried my grids with both GET and POST and I see no reason why both should not work. I don't see any reason to use GET though as the request includes a time stamp anyways so you are not going to be caching requests anyways. – Mark Feb 26 '13 at 12:51
  • Okay. Got your point. But when I am using `mtype: 'POST'`, my `ashx` code file is not recognizing any parameter. So, I am unable to get `HttpRequest["sord"]` or `HttpRequest["sidx"] . What to do? – soham Feb 27 '13 at 08:02
  • I would find some basic examples using the tech stack you are using and see what is different. I'm not sure why your server side isn't recognizing your parameters being passed by jqGrid but this seems like basic functionality. – Mark Feb 27 '13 at 11:39
  • Firefox is just showing this in console, POST `_search=false&nd=1361967061443&rows=20&page=1&sidx=&sord=asc` and but when post occurs naturally(i.e when server really parses data like when saving/adding a row) then with this type of `source`, table-view of parameters is shown. – soham Feb 27 '13 at 12:13