CODEWITHSUNDEEP
asp.netajaxmodel-view-controllerjqgrid
Chris
Chris

Reputation: 788

asp .net mvc jqgrid returns error on post

My jqgrid is returning "The server encountered an unexpected condition that prevented it from fulfilling the request":

$('#list').jqGrid({
            url: "/DesktopModules/MVC/CW.GridTest/Item/getArtists2",
            datatype: 'json',
            mtype: 'POST',
            headers: {
                "ModuleId": ModuleId,
                "TabId": TabId,
                "RequestVerificationToken": rvtoken
            },
            colNames: ['ArtistID', 'ArtistName', 'City'],
            colModel: [
                { name: 'ArtistID', index: 'ArtistID', width: 80, align: 'left', editable: false },
                { name: 'Name', index: 'ArtistName', width: 120, align: 'left', editable: true },
                { name: 'Location', index: 'City',width: 60,align: 'left',editable: true,
                    edittype: "select",
                    editoptions: { value: "FE:FedEx; IN:InTime; TN:TNT" }
                }
            ],
            height: '100%',  
            rowNum: 10,    
            emptyrecords: 'No records',  
            //sortname: 'ArtistName',
            //sortorder: 'desc',
            viewrecords: true,
            caption: 'jqGrid First Grid',
            width: 300,
            //gridview: true,
            jsonReader:  
            {  
                root: "rows",  
                page: "page",  
                total: "total",  
                records: "records",  
                repeatitems: false,  
                Id: "0"  
            },  
        });

While debugging, jqgrid never triggers my controller. I just get the error.

On the other hand, the exact same url works just fine in a standard ajax call:

function update() {
        $.ajaxSetup({ cache: false });
        var rvtoken = $("input[name='__RequestVerificationToken']").val();
        var ModuleId = @Dnn.ModuleContext.ModuleId;
        var TabId = @Dnn.ModuleContext.TabId;

        //$("#notice_div").html('Loading..');
        $.ajax({
            url: "/DesktopModules/MVC/CW.GridTest/Item/getArtists2",
            method: "Post",
            headers: {
                "ModuleId": ModuleId,
                "TabId": TabId,
                "RequestVerificationToken": rvtoken
            },
            success: function(data) {
                $("#dvBands").html(data + "<br/>" + new Date().toISOString());
                $("#notice_div").html('');
                window.setTimeout(update, 10000);
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                $("#notice_div").html('Timeout contacting server..');
                window.setTimeout(update, 60000);
            }

        });

The standard ajax works perfectly. I can see the entire Json string is formatted correctly.

How do I either correct the jqgrid to make its Ajax work, or correct my controller, or how do I set up jqgrid so that I can pass data to it from my working Ajax?

Upvotes: 0

Views: 85

Answers (1)

Oleg
Oleg

Reputation: 221997

Your code don't work because you try to use headers option of jQuery.ajax method as the option of jqGrid. jqGrid don't have headers option, but you can use loadBeforeSend instead, where you call jqXHR.setRequestHeader method:

$('#list').jqGrid({
    url: "/DesktopModules/MVC/CW.GridTest/Item/getArtists2",
    datatype: "json",
    mtype: "POST",
    loadBeforeSend: function (jqXhr) {
        var rvToken = $("input[name='__RequestVerificationToken']").val();
        var moduleId = @Dnn.ModuleContext.ModuleId;
        var tabId = @Dnn.ModuleContext.TabId;

        jqXHR.setRequestHeader("ModuleId", moduleId);
        jqXHR.setRequestHeader("TabId", tabId);
        jqXHR.setRequestHeader("RequestVerificationToken", rvToken);

        return true; // allow the Ajax request
    },
    ...
});

Upvotes: 1

Related Questions