I am having a problem with the Put method of the Combo class. It does not seem to be setting the text in the combo box. Here is my code:
UnitSubstitutionGrid = Class.create(Grid, {
..............
.............
function getOrigResources(thisGrid, selRow, selCol, locfilter, partfilter) {
.......................
.......................
var current = new Array();
var numRows = thisGrid.grid.getRowsNum();
inputs[0].options.length = 0;
for (var i=0;i<numRows;i++)
current[i] = thisGrid.grid.getRowId(i).toUpperCase();
var combo = thisGrid.grid.getCustomCombo(selRow,selCol);
combo.clear();
var cnt = 0;
for (var i=0;i<res.length;i++)
{
var curIndex = current.indexOf(res[i].toUpperCase());
if (curIndex >= 0 || res == null)
continue;
var newOpt = document.createElement('OPTION');
newOpt.text = res[i];
newOpt.value = res[i];
if (cnt == 0) {
newOpt.selected = true;
inputs[0].selectedIndex = 0;
}
if (locfilter.length > 0)
{
if(res[i].toUpperCase().indexOf(locfilter) == 0) {
var newKey = current[current.length - 1];
var newValue = res[i];
combo.put(newKey, newValue);
inputs[0].add(newOpt, cnt++);
The Put method is being called in the second to the last line. It has no effect at all, i.e. the value I am passing in the variable newValue is not shown in the Combo. What am I doing wrong?
Hello,
the code snippet isn’t completely clear. But both getCustomCombo and put methods work.
var combo = mygrid.getCustomCombo(rowId,columnIndex);
combo.put(key1,value1);
combo.put(key2,value2);
…
combo.put(keyN,valueN);
Well, here is the entire function. I added the line:
cell.setValue(res[i])
because that seems to be the only way to get the text I want to be shown in the Combo.
function getOrigResources(thisGrid, selRow, selCol, locfilter, partfilter) {
if(thisGrid.loadingResources == true)
return true;
var maxCount = 50;
var selectedText = "";
jsonrpc.unitSubProcessor.getUnitSubstitutionOrigResources(function(res, error) {
thisGrid.loadingResources = true;
if (error != null && error != "null" && error.length > 0) {
thisGrid.loadingResources = false;
thisGrid.grid.editStop();
alert(error);
}
try
{
if(res != null)
{
var wordPopulated = false;
res.push(locfilter);
var inputs = document.getElementsByClassName('dhx_combo_select');
if (inputs != null && inputs.length > 0)
{
var current = new Array();
var numRows = thisGrid.grid.getRowsNum();
inputs[0].options.length = 0;
for (var i=0;i<numRows;i++)
current[i] = thisGrid.grid.getRowId(i).toUpperCase();
var cell = thisGrid.grid.cells(selRow, selCol);
var combo = thisGrid.grid.getCustomCombo(selRow,selCol);
combo.clear();
var cnt = 0;
for (var i=0;i<res.length;i++)
{
var curIndex = current.indexOf(res[i].toUpperCase());
if (curIndex >= 0 || res == null)
continue;
var newOpt = document.createElement('OPTION');
newOpt.text = res[i];
newOpt.value = res[i];
if (cnt == 0) {
newOpt.selected = true;
inputs[0].selectedIndex = 0;
}
if (locfilter.length > 0)
{
if(res[i].toUpperCase().indexOf(locfilter) == 0) {
if (!wordPopulated)
{
cell.setValue(res[i]);
wordPopulated = true;
} // End if
combo.put(res[i], res[i]);
inputs[0].add(newOpt, cnt++);
}
}
else
{
if (!wordPopulated)
{
cell.setValue(res[i]);
wordPopulated = true;
} // End if
combo.put(res[i], res[i]);
inputs[0].add(newOpt, cnt++);
}
if (i>=maxCount)
break;
}
combo.save();
}
}
}
catch(e) {
thisGrid.loadingResources = false;
thisGrid.grid.editStop();
}
thisGrid.loadingResources = false;
}, thisGrid.options.cacheId, locfilter, partfilter, maxCount);
return true;
}
Yes, put() adds options to the combo. However, if you need to set cell value (select combo option), you need to call setValue() method.
Actually I am adding the options using this:
inputs[0].add(newOpt, cnt++);
the line:
combo.put(res[i], res[i]);
does not seem to be doing anything. If I comment out the other two lines like so:
if (!wordPopulated)
{
//cell.setValue(res[i]);
wordPopulated = true;
} // End if
combo.put(res[i], res[i]);
//inputs[0].add(newOpt, cnt++);
nothing happens.
The effect I am trying to achieve is the following: as the user types characters in the selected gridcell all words(pulled from database) starting with the characters in question get added as options in the Combo and the very first word gets populated in the gridcell.
So for example, if the user types ‘A’ three options get get added to the combo, ‘ABC’, AED’, and ‘AGTF’. What I want is ‘ABC’ to be populated in the cell at this point and ‘BC’ is highlighted. Then if the user types ‘E’ next, I want ‘AED’ to be populated in the selected grid cell, with ‘D’ highlighted.
So far I can add the options and populate the first word in the gridcell, but at this point the mouse cursor is at the end of the word, while it should be after the first character. SO, is there a way to set the mouse cursor to any index I want?
The effect I am trying to achieve is the following: as the user types characters in the selected gridcell all words(pulled from database) starting with the characters in question get added as options in the Combo and the very first word gets populated in the gridcell.
It is similar to dhtmlxCombo with dynamic filtering and autocomplete:
dhtmlx.com/docs/products/dht … ilter.html
The PRO edition of the grid provides the ready implementation with dhtmlxCombo (the 3rd column in the sample):
dhtmlx.com/docs/products/dht … combo.html
You may also create a custom cell type:
docs.dhtmlx.com/doku.php?id=dhtm … le_excells
The second example seems to be doing exactly what I need, but I don’t understand how it is doing it. In the source code there is a line:
mygrid.loadXML("../common/combo.xml");
that loads the settings for the grid from an XML file, but the content of the XML file itself is not shown. I’d like to see that if possible.
Also, how can I find out if I have the PRO edition of the grid?
You may find the xml in the Grid package:
samples/common/combo.xml