Dropdown in Grid – Usage Issue

[KeshavanParticipant]

Hi,

I have a grid in which the first 2 columns are of type ‘Dropdownlist’.

I have 3 data sources accordingly for the 2 ‘dropdowns’ and 1 for the main grid.

I have 3 adapters for the 3 sources , I have used ‘autobind’ w.r.t the 2 data sources for the 2 dropdowns.

Is there any limit to the no of adapters in a Grid ?.

Please let me know if the below code is wit out errors,

$(document).ready(function ()
{
// prepare data from external GroupCompany entity
var source1 =
{
datatype: “json”,
datafields:
[
{ name: ‘CompanyId’ },
{ name: ‘CompanyName’ }
],
id: ‘CompanyId’,
url: ‘Company/GetPartCompanies’,
async: false
}
var dataAdapater1 = new $.jqx.dataAdapter(source1, { autoBind: true })
var source2 =
{
datatype: “json”,
datafields:
[
{ name: ‘DepartmentId’ },
{ name: ‘DepartmentName’ }
],
id: ‘DepartmentId’,
url: ‘Department/GetPartDepartments’,
async: false
}
var dataAdapater2 = new $.jqx.dataAdapter(source2, { autoBind: true })
var data = {};
var generaterow = function (id)
{
var row = {};
row[“EmployeeId”] = id;
row[“CompanyId”] = 1;
row[“DepartmentId”] = 1;
row[“EmployeeCode”] = ” “;
row[“EmployeeName”] = ” “;
row[“MobileNo”] = ” “;
row[“EmailId”] = ” “;
row[“Active”] = 1;
return row;
}
var source3 =
{
datatype: “json”,
datafields:
[
{ name: ‘EmployeeId’ },
{ name: ‘CompanyId’, value: ‘CompanyId’, values: { source: dataAdapater1.records,
value: ‘CompanyId’, name: ‘CompanyName’
}
},
{ name: ‘CompanyName’ },
{ name: ‘DepartmentId’, value: ‘DepartmentId’, values: { source: dataAdapater2.records,
value: ‘DepartmentId’, name: ‘DepartmentName’
}
},
{ name: ‘DepartmentName’ },
{ name: ‘Employeecode’ },
{ name: ‘EmployeeName’ },
{ name: ‘MobileNo’ },
{ name: ‘EmailId’ },
{ name: ‘Active’ }
],
id: ‘EmployeeId’,
url: ‘Employee/GetEmployees’,

}

var dataAdapater3 = new $.jqx.dataAdapter(source3);
$(“#jqxgrid”).jqxGrid(
{
width: 950,
height: 350,
source: dataAdapater3,
theme: ‘ui-smoothness’,
editable: true,
selectionmode: ‘multiplecells’,
editmode: ‘click’,
rowdetails: true,
rowsheight: 20,
sortable: true,
pageable: true,
filterable: true,
columnsresize: true,
columnsreorder: true,
groupable: true,
altrows: true,
columns:
[
{ text: ‘Company’, datafield: ‘CompanyId’, columntype: ‘dropdownlist’,
displayfield: ‘CompanyName’, datafield: ‘CompanyId’, width: 150,
createeditor: function (row, cellvalue, editor) {
editor.jqxDropDownList
({ source: dataAdapater1, displayMember: ‘CompanyName’,
valueMember: ‘CompanyId’
});

}
},
{ text: ‘Department’, datafield: ‘DepartmentId’, columntype: ‘dropdownlist’,
displayfield: ‘DepartmentName’, datafield: ‘DepartmentId’, width: 150,
createeditor: function (row, cellvalue, editor) {
editor.jqxDropDownList
({ source: dataAdapater2, displayMember: ‘DepartmentName’,
valueMember: ‘DepartmentId’
});
}
},

{ text: ‘Code’, datafield: ‘EmployeeCode’, width: 60 },
{ text: ‘Name’, datafield: ‘EmployeeName’, width: 170 },
{ text: ‘Mobile No’, datafield: ‘MobileNo’, width: 110 },
{ text: ‘Email’, datafield: ‘EmailId’, width: 150 },
{ text: ‘If Active’, datafield: ‘Active’, width: 80 },
]
});

});

Thanks,

Keshavan

/html>

[Peter StoevKeymaster]

Hi Keshavan,

No, there is no limit on the number of adapters. However, I found out that you have syntax errors in your initialization like ‘,’ for last array and object items.

Example: { text: ‘If Active’, datafield: ‘Active’, width: 80 },

and url: ‘Employee/GetEmployees’,

In addition, the current version is jQWidgets 2.8. If you use a different version, I suggest upgrading to the latest one.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts