Grid-Unable to set column type – DropDownlist

[KeshavanParticipant]

 Hi,

  I am unable to set column type s 'dropdownlist', below is the part of the code,
  Pls help.

  Thanks,

  Keshavan

            

var source3 =
{
datatype: “json”,
datafields:
[
{ name: ‘CustomerId’ },
{ name: ‘CustomerName’ }
],
id: ‘CustomerId’,
url: ‘/Customer/GetCustomer’,
async: false
}
var dropDownListSource = new $.jqx.dataAdapter(source3);

$(“#jqxgrid”).jqxGrid(
{
width: 960,
height: 370,
source: source,
theme: ‘ui-sunny’,
rowdetails: true,
rowsheight: 25,
columnsresize: true,
columnsreorder: true,
enabletooltips: true,
sortable: true,
groupable: true,
initrowdetails: initrowdetails,
rowdetailstemplate: { rowdetails: “<div id=’grid’ style=’margin: 3px;’></div>”, rowdetailsheight: 150, rowdetailshidden: true },
ready: function () {
$(“#jqxgrid”).jqxGrid(‘showrowdetails’, 0);
},
columns:
[
{ text: ‘OrderId’, datafield: ‘OrderId’, width: 100, cellsrenderer: renderer },
{
text: ‘Customer’, datafield: ‘CustomerId’, displayfield: ‘CustomerName’, columntype: ‘dropdownlist’, width: 400,
createeditor: function (row, value, editor)
{
editor.jqxDropDownList({ source: dropDownListSource, displayMember: ‘label’, valueMember: ‘value’ });
}
},
{ text: ‘Order Date’, datafield: ‘OrderDate’, formatString: ‘MM/dd/yyyy’, theme: ‘ui-sunny’,width: 130, cellsrenderer: renderer },
{ text: ‘Order Amount’, datafield: ‘OrderAmount’, width: 100, cellsrenderer: renderer },
{ text: ‘Order Status’, datafield: ‘OrderStatus’, width: 150, cellsrenderer: renderer }
]
});

[DimitarParticipant]

Hello Keshavan,

In source3 you have the datafields “CustomerId” and “CustomerName”, yet in the dropdownlist initialization you refer to “label” and “value”, which are not defined. We suggest that you change “label” and “value” to “CustomerName” and “CustomerId” respectively.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts