Question

i am using jqwidgets to bind the gird like mentioned below:

var url = "sampledata/customers.xml";
var parentsLength = $("#jqxWidget").parents().length;
if (parentsLength > 3) {
    url = 'sampledata/customers.xml';
}

// prepare the data
var source = {
    datatype: "xml",
    datafields: [
        { name: 'CompanyName', map: 'm\\:properties>d\\:CompanyName' },
        { name: 'ContactName', map: 'm\\:properties>d\\:ContactName' },
        { name: 'ContactTitle', map: 'm\\:properties>d\\:ContactTitle' },
        { name: 'City', map: 'm\\:properties>d\\:City' },
        { name: 'PostalCode', map: 'm\\:properties>d\\:PostalCode' },
        { name: 'Country', map: 'm\\:properties>d\\:Country' }
    ],
    root: "entry",
    record: "content",
    id: 'm\\:properties>d\\:CustomerID',
    url: url
};

// Create jqxGrid
$("#jqxgrid").jqxGrid(
{
    width: 670,
    source: source,
    theme: theme,
    columnsresize: true,
    columns: [
        { text: 'Company Name', datafield: 'CompanyName', width: 250 },
        { text: 'Contact Name', datafield: 'ContactName', width: 150 },
        { text: 'Contact Title', datafield: 'ContactTitle', width: 180 },
        { text: 'City', datafield: 'City', width: 120 },
        { text: 'Postal Code', datafield: 'PostalCode', width: 90 },
        { text: 'Country', datafield: 'Country', width: 100 }
    ]
});

But now i have dynamic grid with unknown columns and rows in it. How do i bind? I am calling web service to get the grid data in XML format.

Answer 1

You can probably use the jqxDataAdapter plug-in and pass your source object as a parameter to the data adapter. Then set the Grid’s source property to point to the dataAdapter instead of directly pointing to your source. In the jqxDataAdapter’s loadComplete function call, build the columns array and pass it to the Grid.

Something like that:

$("#jqxgrid").jqxGrid({columns: myColumnsArray});