jQWidgets Forums

Hey guys – I have a grid and am trying to place a dropdown column type in each of two cells in the grid. Which ever cell I put first, it works, but the second one only shows the JSON value and not the dropdown values. Did I screw something up or is this a bug?

Here is a sample of the JSON data:

[{“municipalityId”:1,”municipalityName”:”Adamstown”,”dbAccess”:0,”mbAccess”:0},{“municipalityId”:2,”municipalityName”:”Albany Township”,”dbAccess”:0,”mbAccess”:0},{“municipalityId”:3,”municipalityName”:”Alsace Township”,”dbAccess”:0,”mbAccess”:0},{“municipalityId”:4,”municipalityName”:”Amity Gardens”,”dbAccess”:0,”mbAccess”:0},{“municipalityId”:5,”municipalityName”:”Amity Township”,”dbAccess”:0,”mbAccess”:0},{“municipalityId”:6,”municipalityName”:”Bally”,”dbAccess”:0,”mbAccess”:0}]

Here is the code for the grid:

function doGrid1(userID) {
var accesslevels = [
{ value: “0”, label: “None” },
{ value: “1”, label: “Read Only” },
{ value: “2”, label: “Full” },
{ value: “3”, label: “Admin” }
];

var accesslevelsSource =
{
datatype: “array”,
datafields: [
{ name: ‘label’, type: ‘string’ },
{ name: ‘value’, type: ‘string’ }
],
localdata: accesslevels
};
var accesslevelsAdapter = new $.jqx.dataAdapter(accesslevelsSource, {
autoBind: true
});

// prepare the data
var gridsource = {
datatype: “json”,
datafields: [
{ name: ‘municipalityId’ },
{ name: ‘municipalityName’ },
{ name: ‘mbAccess’, value: ‘mbAccess’, values: { source: accesslevelsAdapter.records, value: ‘value’, name: ‘label’ } },
{ name: ‘dbAccess’, value: ‘dbAccess’, values: { source: accesslevelsAdapter.records, value: ‘value’, name: ‘label’ } }
],
url: ‘@Url.Action(“GetUserPermissions”)’ + ‘?UserID=’ + userID
};

var dataAdapter1 = new $.jqx.dataAdapter(gridsource, { async: false, autoBind: true, loadError: function (xhr, status, error) { alert(‘Error loading “‘ + gridsource.url + ‘” : ‘ + error); } });

var settings = {
width: 800,
source: dataAdapter1,
autoheight: true,
//columnsresize: true,
editable: true,
groupable: false,
//filterable: true,
pageable: false,
selectionmode: ‘singlerow’,
theme: ‘orion’,
sortable: false,
columns: [
{ text: ”, datafield: ‘municipalityId’, editable: false, visible: false },
{ text: ‘Municipality’, datafield: ‘municipalityName’, width: 250, editable: false },
{
text: ‘Mobile Access’, datafield: ‘mbAccess’, displayfield: ‘mbAccess’, columntype: ‘dropdownlist’, width: 200,
createeditor: function (row, value, editor) {
editor.jqxDropDownList({ source: accesslevelsAdapter, displayMember: ‘label’, valueMember: ‘value’ });
}
},
{
text: ‘Dashboard Access’, datafield: ‘dbAccess’, displayfield: ‘dbAccess’, columntype: ‘dropdownlist’, width: 200,
createeditor: function (row, value, editor) {
editor.jqxDropDownList({ source: accesslevelsAdapter, displayMember: ‘label’, valueMember: ‘value’ });
}
}
]

};

$(“#jqxgrid1”).jqxGrid(settings);
}

And finally, I have included a screen shot of the issue…