Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Jack
815
Add HTTP Headers to igGrid dataSource
posted

I have an igGrid with the dataSource property set, but I can't find a way to add a custom HTTP Header.

For example, see below for my grid:

$("#GRIDUsers").igGrid({
        columns: [
            { headerText: "Options", key: "Options", dataType: "string", width: "100px", unbound: true, template: optionString },
            { headerText: "ID", key: "ID", dataType: "string", hidden: true },
            { headerText: "Effective Date", key: "EffectiveDate", dataType: "date", width: "130px" },
            { headerText: "Frequency", key: "Frequency", dataType: "string", hidden: true },
            { headerText: "Client", key: "ClientName", dataType: "string" },
            { headerText: "Status", key: "Status", dataType: "string", width: "120px" },
            { headerText: "Service", key: "ServiceType", dataType: "string", hidden: true },
            { headerText: "Action", key: "ActionType", dataType: "string" },
            { headerText: "Notes", key: "Notes", dataType: "string", template: "<p class='grid-fixed-row-height'>${Notes}</p>" },
            { headerText: "Created By", key: "CreatedBy", dataType: "string" },
            { headerText: "Created On", key: "CreatedTS", dataType: "date", width: "120px" }

        ],
        responseDataKey: "0.d",
        autoCommit: true,
        width: "auto",
        height: "400px",
        autoGenerateColumns: false,
        renderCheckboxes: true,
        primaryKey: "ID",
        dataSource: "https://mywebsite.com/api/Users"
    });

The problem is that my API is expecting an HTTP Header called "APIKey" with a string value such as "12345". How can I add this HTTP Header?

Parents
No Data
Reply
  • 29417
    Offline posted

    Hello Jack, 

    Thank you for posting in our forum. 

    Currently the grid’s ajax requests are not public and there’s no option out of the box to set custom headers to them.

    As you don’t seem to have any remote features enabled and are simply binding the grid to a the data from a remote service, you could make your own ajax request with the necessary custom headers and bind the result data from the service directly to the grid. For example:

     

    $.ajax({
url: url,
headers: {
"Custom": "Value"
}
}).done( function(data) {
$("#grid").igGrid({
...
dataSource: data
});
});

     

    Let me know if you have any questions. 

    Regards,

    Maya Kirova

Children