jqGrid parameters. Can't be passed

Question

I call web-service to fill jqGrid and wants to pass parameters to it

I use the following code (client side):

jQuery('#EmployeeTable').jqGrid({
    datatype: function () {
        var params = new Object();
        params.page = 10;
        params.Filter = true;
        params.DateStart = null;
        params.DateEnd = null;
        params.TagID = null;
        params.CategoryID = 3;
        params.StatusID = 1;
        params.IsDescription = true;
        $.ajax({
            url: '/Admin/IdeasJSON',
            type: "POST",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify(params),
            dataType: "json",
            success: function (data, st) {
                if (st == "success") {
                    var grid = $("#EmployeeTable")[0];
                    grid.addJSONData(data);
                }
            },
            error: function () {
                alert("Error with AJAX callback");
            }
        });
    },

also, there is propotype of web-method (MVC):

public JsonResult IdeasJSON(int? page, bool? Filter, DateTime? DateStart, DateTime? DateEnd, int? TagID, int? CategoryID, int? StatusID, bool? IsDescription)

Why all these parameters are null?

[ADDED 04/11]

    jQuery(document).ready(function () {
        var StatusID = null, Filter = null, page = null, DateStart = null, DateEnd = null, TagID = null, CategoryID = null, IsDescription = null;
        if (jQuery.url.param('StatusID') != null) {
            StatusID = jQuery.url.param('StatusID');
        }

        if (jQuery.url.param('Filter') != null) {
            Filter = jQuery.url.param('Filter');
        }

        if (jQuery.url.param('page') != null) {
            page = jQuery.url.param('page');
        }

        if (jQuery.url.param('DateStart') != null) {
            DateStart = jQuery.url.param('DateStart');
        }

        if (jQuery.url.param('DateEnd') != null) {
            DateEnd = jQuery.url.param('DateEnd');
        }

        if (jQuery.url.param('TagID') != null) {
            TagID = jQuery.url.param('TagID');
        }

        if (jQuery.url.param('CategoryID') != null) {
            CategoryID = jQuery.url.param('CategoryID');
        }

        if (jQuery.url.param('IsDescription') != null) {
            IsDescription = jQuery.url.param('IsDescription');
        }



        jQuery('#EmployeeTable').jqGrid({
            url: '/Admin/IdeasJSON',
            datatype: 'json',
            postData: { page: page, Filter: Filter, DateStart: DateStart, DateEnd: DateEnd, TagID: TagID, StatusID: StatusID, CategoryID: CategoryID, IsDescription: IsDescription },
            jsonReader: {
                page: "page",
                total: "total",
                records: "records",
                root: "rows",
                repeatitems: false,
                id: ""
            },
            colNames: ['Logged By', 'Logging Agency (ID)', 'Title', 'Status', 'Points', 'Categories', 'Created Date', 'Description', 'Jira ID#', 'Portal Name', '', '', '', '', '', '', ''],
            colModel: [
                        { name: 'LoggedBy', width: 100 },
                        { name: 'LoggingAgencyID', width: 85 },
                        { name: 'Title', width: 100 },
                        { name: 'Status', width: 100 },
                        { name: 'Points', width: 40, align: 'center' },
                        { name: 'Categories', width: 100 },
                        { name: 'CreatedDate', width: 80, formatter: ndateFormatter },
                        { name: 'Description', width: 300 },
                        { name: 'JiraID', width: 55 },
                        { name: 'PortalName', width: 100 },
                        { name: 'IdeaID', width: 25, formatter: ActionDescriptionFormatter },
                        { name: 'IdeaID', width: 25, formatter: ActionEditFormatter },
                        { name: 'IdeaID', width: 25, formatter: ActionDeleteFormatter },
                        { name: 'IdeaGridCommentsAndSubideas', width: 25, formatter: ActionIdeaGridCommentsAndSubideas },
                        { name: 'IdeaGridCountVotes', width: 25, formatter: ActionIdeaGridCountVotes },
                        { name: 'IdeaGridCountVotes', width: 25, formatter: ActionIdeaGridLinkIdeas },
                        { name: 'IdeaGridCountVotes', width: 25, formatter: ActionIdeaGridIdeaType },
                    ],
            pager: '#EmployeeTablePager',
            width: 1000,
            viewrecords: true,
            caption: 'Idea List',
            excel: true
        }).jqGrid('navGrid', '#EmployeeTablePager', {
            add: false,
            edit: false,
            del: false,
            search: false,
            refresh: false
        }).jqGrid('navButtonAdd', '#EmployeeTablePager', {
            caption: " Export to Excel ",
            buttonicon: "ui-icon-bookmark",
            onClickButton: ReturnExcel,
            position: "last"
        }).jqGrid('navButtonAdd', '#EmployeeTablePager', {
            caption: " Export to CSV ",
            buttonicon: "ui-icon-bookmark",
            onClickButton: ReturnCSV,
            position: "last"
        });
    });

score 1 · Accepted Answer · edited May 23 '17 at 12:26

1

You should not use datatype as the function to use the JSON data. Probably you used template of very old examples.

For example in the "UPDATED" part of the answer you could find full demo project which demonstrate how to use jqGrid in ASP.MVC 2.0 inclusive paging, sorting and filtering/advanced searching.

If you want post some additional parameters to the server as a part of jqGrid request you should use postData parameters in the form postData: {CategoryID: 3, StatusID: 1, IsDescription:true, Filter: true}

edited May 23 '17 at 12:26

Community

1
1

answered Apr 10 '11 at 21:42

Oleg

220,925
34
403
798

I really don't understand how it works. I see only that parameter named "sord" as parameter of method in controller and "sortorder" in javascript. How is it linked? – Oleg Sh Apr 10 '11 at 22:16
It is the same. jqGrid define the names of some parameters included in the url with respect of `prmNames` parameter (see [documentation](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options)). Do you good understand how `datatype` as function or `addJSONData` work? You should not use the way. – Oleg Apr 10 '11 at 22:37
yes, I understand now, it's very simple. I spent 3 hours and in result it was added 1 string :) – Oleg Sh Apr 10 '11 at 22:55
only one question - how to pass "page" value? – Oleg Sh Apr 10 '11 at 22:55
@user285336: the `page` value will be send automatically by jqGrid. – Oleg Apr 10 '11 at 22:57
I need to specify which page should be opened after loading a grid – Oleg Sh Apr 10 '11 at 23:24
@user285336: It is just the `page` parameter (1-based) of jqGrid. Default value of the parameter is 1. – Oleg Apr 10 '11 at 23:38
postData: { page: page, Filter: Filter, DateStart: DateStart, DateEnd: DateEnd, TagID: TagID, StatusID: StatusID, CategoryID: CategoryID, IsDescription: IsDescription }, does not work – Oleg Sh Apr 11 '11 at 00:11
@user285336: What you posted is not a code. To be able to help you you should post **full JavaScript code**. Now you spend only our time. – Oleg Apr 11 '11 at 06:33
I can't add this to comment. Added full javascript to main post. When url has parameter named StatusID - it's passed, but "page" is not – Oleg Sh Apr 11 '11 at 11:05
@user285336: The first problem in your code: `page` parameter name what you get from the url is not the same what use jqGrid. You have name conflict and should use variable with another name. The second problem: you include many columns with **the same** `name` attributes (`'IdeaID'` `'IdeaGridCountVotes'`) which is not permitted. You have to assign unique names to columns. – Oleg Apr 11 '11 at 11:23

jqGrid parameters. Can't be passed

1 Answers1