Set Dropdownlist Column Value in a Grid

[chronosx7Participant]

Hi, I’m updating my grid rows by pulling json data from the server. However three of the columns in the grid are dropdownlists with value-label pairs like {1: National}, {2: International}, {3: Local} etc. That is, the value is different from the label and I am pulling the value from the server(As stored in the database). The problem is, when the rows are updated after the ajax call, the columns with dropdownlists show the value instead of the label.

Does anyone know how to make those cells to display the label corresponding to the value rather than the value itself?

P.S:

• I am pulling the data to a local json object and initializing the dataAdapter with said data as localata.
• As required by the dataAdapter there’s a datafields array which describe the fields of the data.
• The options of the dropdownlists are pulled from the server when the page loads and the grid table is initialized.

This code ‘pushes’ the data into the grid.

        var fields = [];
        $.each(data.fields, function(index, value){
          fields.push({name: value, type: 'string'});
        });
        var source = {
          datatype: 'json',
          localdata: data.rows,
          datafields: fields,
        };
        var adapter = new $.jqx.dataAdapter(source);
        $('#myTable').jqxGrid('source', adapter);

Thanks in advance.

[HristoParticipant]

Hello chronosx7,

You could convert your “value-label pairs” json to something like this { value: 1, label: National }.
This transformation could prepare in ‘beforeLoadComplete’ in DataAdapter. Next step is to set displayMember: 'label' to jqxDataAdapter.
If you still have same issue please provide us an example with your code with local data.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts