jqxGrid with ComboBox, How to select an item in combobox ?
OK
by mogador
HTML
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<script src=" http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id="jqxgrid"></div>
<button id="bt_fill">fill grid</button>
JavaScript
var aProfesseurs = [];
var aDataGrid = [];
// fill array combobox
var aLine = [];
aLine['idProfesseur'] = 0;
aLine['nomPrenom'] = 'James A';
aProfesseurs.push(aLine);
aLine = [];
aLine['idProfesseur'] = 1;
aLine['nomPrenom'] = 'John B';
aProfesseurs.push(aLine);
// fill array Grid
aLine = [];
aLine['idProfesseur'] = 1;
aLine['groupe'] = 'Group A';
aLine['idGroupe'] = '0';
aDataGrid.push(aLine);
aLine = [];
aLine['idProfesseur'] = 0;
aLine['groupe'] = 'Group B';
aLine['idGroupe'] = '1';
aDataGrid.push(aLine);
var oSourceComboBox = {
localdata: aProfesseurs,
datatype: 'array',
datafields: [{
name: 'idProfesseur',
type: 'int'
},
{
name: 'nomPrenom',
type: 'string'
}
]
};
var oAdapterComboBox = new $.jqx.dataAdapter(oSourceComboBox);
var oSourceGrid = {
localdata: aDataGrid,
datatype: 'array',
datafields: [{
name: 'idProfesseur',
type: 'int',
values: {
source: oAdapterComboBox,
value: 'idProfesseur',
name: 'nomPrenom'
}
},
{
name: 'nomPrenom',
type: 'string'
},
{
name: 'libelleGroupe',
type: 'string'
},
{
name: 'idGroupe',
type: 'int'
}
],
id: 'idGroupe'
};
var oAdapter = new $.jqx.dataAdapter(oSourceGrid);
$('#jqxgrid').jqxGrid({
source: oAdapter,
selectionmode: 'singlecell',
editable: true,
editmode: "click",
columnsresize: true,
sortable: false,
sortmode: 'many',
// autoheight: true,
// autorowheight: true,
columns: [{
text: 'Prof',
editable: true,
datafield: 'idProfesseur',
displayfield: 'nomPrenom',
minwidth: 120,
width: '20%',
columntype: 'combobox',
createeditor: function(row, column, editor) {
editor.jqxComboBox({
autoOpen: true,
searchMode: 'none',
animationType: 'none',
source: oAdapterComboBox,
valueMember:...