How to load the data for a jqGrid using an Id from the URL parameter

Question

I can't seem to figure out how to load a jqGrid based on an Id from a parameter in the URL. Basically i have the address \Locations\Departmetn?LocationId=1 now i want to load the grid based on the location Id. The grid is just using the address \Locations\GetDepartments to get the controller to return the data as a jSonResult which is all working fine, I just dont know how/if i can send the location Id to that URL \Locations\GetDepartments

$(function () {

    $.widget('qs.department_page', {

    _create: function () {

        var self = this;
        this.scroll_to_end = false;

        var LocId = 1; //hardcoded for the test

        // get my child dom elements
        this.department_pager = $("#department_pager");

        // set up the grid and pager
        this.department_grid = $("#department_grid").jqGrid(
        {
            url: "/Location/GetDepartments/",
            datatype: "json",
            mtype: "POST",
            height: 300,
            hidegrid: false,
            colNames: ['Name', 'Site Num', 'Description', 'ABN'],
            colModel: [
                { name: 'Name', index: 'Name', width: 200, align: "left", sortable: false },
                { name: 'SiteNum', index: 'SiteNum', width: 100, align: "left", sortable: false },
                { name: 'Company', index: 'Company', width: 200, align: "left", sortable: false },
                { name: 'ABN', index: 'ABN', width: 200, align: "left", sortable: false }
            ],
            caption: "Departments",
            pager: this.department_pager
        })
        .navGrid('#department_pager', {
            addfunc: function () { self.onNewDepartment(); },
            editfunc: function (val) { self.onEditDepartment(val); },
            search: false,
            refresh: false
        },
            {/*add*/
            },
            {/*edit*/
            },
            { url: "/Location/DeleteDepartment" }
        );

}

You use HTTP `POST`. Do you really need to send `LocationId` as part of URL or to **post** `LocationId` together with other standards jqGrid parameters (`page`, `rows`, `sidx` etc) as part of HTTP body? — Oleg, Feb 22 '13 at 11:01

score 1 · Accepted Answer · answered Feb 22 '13 at 10:57

1

there are many ways one ways is below,

call beforerequest and extend postadata. in controller you will get LocationID value.

 beforeRequest: function () {

                var postData = $('#department_grid').jqGrid('getGridParam', "postData");
                $.extend(postData, { LocationID: "give your location id" });
            },

Hope this will solve.

answered Feb 22 '13 at 10:57

Meraj

426
3
10
22

exactly what ive been trying to do but just to dumb to do it, thank you very much :) – Anthony Feb 22 '13 at 11:11
@Anthony: The solution extends the data which will be **POSTed** to the server instead of appending URL like you asked. If you need to expend the data which need be posted you can use just `postData` parameter of jqGrid in the form `postData: {LocationID: "give your location id"}`. If the value of `LocationID` is not constant then one can use function as the value of `LocationID`. See [the answer](http://stackoverflow.com/a/2928819/315935) for more details. – Oleg Feb 22 '13 at 11:18
@Anthony: Oleg solution is better if you need to extend the the postData which i did in beforeRequest method. and again thanks to Oleg. he is a big hero for solving jQgrid queries. – Meraj Feb 22 '13 at 11:46

score 0 · Answer 2 · answered Feb 22 '13 at 10:57

0

what if you consider usage of rest service to use links like /Location/Departments/{Id}?

answered Feb 22 '13 at 10:57

sviklim

1,054
1
15
30

How to load the data for a jqGrid using an Id from the URL parameter

2 Answers2