Combobox Cellrenderer problem

[neatgadgets]

I am having trouble applying a different array for a combobox

I have created a datagrid, and then I am trying to use cellrenderer to put a combobox in a column.

Normally I set up the datagrid, then use the following code to create the column that the combobox is going in:

var column = new DataGridColumn("species_id");
column.headerText = "species_id";
column.width = 70;
column.cellRenderer = "ComboBoxCell";
dgIndividualBirdData.addColumn(column);

A sample array I am wanting to add is [{label: "Test", data: 1}];

The class is as follows:

import mx.controls.ComboBox;
import mx.controls.DataGrid;

class ComboBoxCell extends MovieClip {

private var _ccbMenu:ComboBox;
private var listOwnerataGrid;
private var owner:MovieClip;
private var createClassObject:Function;
private var getCellIndex:Function;
private var getDataLabel:Function;

function ComboBoxCell() {
init();
}

private function init():Void {
createClassObject(ComboBox, "_ccbMenu", 1);
_ccbMenu.dataProvider = [];
_ccbMenu.addEventListener("change", this);
}


private function change(oEvent:Object):Void {
listOwner.editField(getCellIndex().itemIndex, getDataLabel(), _ccbMenu.value);
}

public function getPreferredWidth():Number {
return 100;
}

public function getPreferredHeight():Number {
return 25;
}

public function setSize(nWidth:Number, nHeight:Number):Void {
_ccbMenu.setSize(nWidth, _ccbMenu.height);
}

public function setValue(sLabel:String, oItem:Object, sState:String):Void {
_ccbMenu.visible = (oItem != undefined);
for(var i:Number = 0; i < _ccbMenu.length; i++) {
if(_ccbMenu.getItemAt(i).data == oItem[getDataLabel()]) {
_ccbMenu.selectedIndex = i;
break;
}
}
}

}

Just not exactly how to do this

[Jorge Solis]

Check http://www.flash-db.com/Tutorials/cellrenderer/

Jorge

[neatgadgets]

Hi, thankyou for your reply. I have read this tutorial, but I don't see how it relates to being able to change the array that is associated with the combobox dynamically? The labels/data in the comboboxes are set within the class, they are hardcoded. I want to be able to use the class for multiple datagrids but be able to change the labels/data in the comboboxes.

[Jorge Solis]

The dataprovider collect data like this:

data_array = new Array();
data_array.push({Model:[{label:"Ford", data:"1000"}, {label:"Chevrolet", data:"800"}, {label:"Renault", data:"1600"}], Year:"Ten"});
data_array.push({Model:[{label:"Ford", data:"1500"}, {label:"Fiat", data:"1000"}, {label:"Mercedes", data:"2500"}], Year:"Five"});
data_array.push({Model:[{label:"Mitsubishi", data:"1200"}, {label:"Mazda", data:"1800"}, {label:"Renault", data:"2000"}], Year:"Two"});
myDataGrid_dg.dataProvider = data_array;

Since tihs is hardcoded, you can build your dataProvider from any source (database, XML, txt ) as far as you build the proper data structure. In other words, you should manipulate the data in your dataProvider, you can´t re-render a cell individually

Jorge

[neatgadgets]

The issue is not with putting data into the datagrid, it is being able to change the labels in the combobox. Currently the labels are hardcoded in the class file. How do I take this out of the class file and have a function call to the class that changes the labels in the combobox?

[neatgadgets]

I'll try and make it clearer. What I want to do is use the same CellRenderer for multiple datagrids. Each datagrid might have different lists in the combobox. At the moment, the .as file has the array for the combobox hardcoded meaning that I can only use those values. I would have to create a new .as file for every datagrid and I don't want to do that if I don't have to.

[Jorge Solis]

I have mention my example because labels are not hardcoded in the class, but labels comes in dataProvider. I.e, supose I want three diferent labels for each combobox in my 3 row datagrid, I can do like this:

[as]
data_array.push({Model:[{label:"Ford", data:"1000"}, {label:"Chevrolet", data:"800"}, {label:"Renault", data:"1600"}], Year:"Ten"});
data_array.push({Model:[{label:"Coca Cola", data:"coca"}, {label:"Pepsi", data:"pepsi"}, {label:"Fanta", data:"fanta"}], Year:"Five"});
data_array.push({Model:[{label:"George", data:"30"}, {label:"Karen", data:"25"}, {label:"Mike", data:"20"}], Year:"Two"});
[/as]

Now I have three rows each one with different labels, since the label is not hardcoded in the cellrenderer class.
Of course I can create different dataProviders for different datagrids changing labels at any time

The function for setValue I have is like this:

function setValue(str:String, item:Object, sel:Boolean) : Void

{

//Get values from the dataProvider

//item.Model is an array of labels/data pairs

combo._visible = (item!=undefined);

combo.dataProvider = item.Model;

}

So I just take the dataProvider from the cell data. Now look at yours:

public function setValue(sLabel:String, oItem:Object, sState:String):Void {

_ccbMenu.visible = (oItem != undefined);

for(var i:Number = 0; i < _ccbMenu.length; i++) {

if(_ccbMenu.getItemAt(i).data == oItem[getDataLabel()]) {

_ccbMenu.selectedIndex = i;

break;

}
}

You just walk trough combobox data to set the selected item, you're not assigning the data the dataProvider carries. Make sense?

Jorge

[neatgadgets]

Ok, I figured it out now.

Here is the scenario I have. If I have a combobox (not in the datagrid) and when I change it, it changes the data in the datagrid, will the combobox in the data grid update?

[Jorge Solis]

Sure, each each time you change values in dataProvider, the setValue method fires in the cellRenderer

Jorge

[neatgadgets]

Hi and thanks for your help. I have one other question. From what I understand, the combobox gets all its values from the dataprovider, ie a unique list of all the values in that column of data. However what if there are othe values not in the column that I want the user to be able to select?

[neatgadgets]

Ignore that, just looked at the dataprovider example and I have figured out that you can even have a unique list for each combobox which is excellent!

[neatgadgets]

I have setup a script to create the dataprovider, but just wondering if there is a quick way to make the selected item move to the top rather than loop through the combobox list until the value is found for each combobox.

[Jorge Solis]

You can manipulate the order when setting the dataProvider, so the desired item is on top of the list, once assigned, you should loop, but is not necesary since you know the value in advance

Jorge

[neatgadgets]

Ok, very close to getting it going now.

Where you have the code:

Code:

data_array.push({Model:[{label:"Ford", data:"1000"}, {label:"Chevrolet", data:"800"}, {label:"Renault", data:"1600"}], Year:"Ten"});
data_array.push({Model:[{label:"Coca Cola", data:"coca"}, {label:"Pepsi", data:"pepsi"}, {label:"Fanta", data:"fanta"}], Year:"Five"});
data_array.push({Model:[{label:"George", data:"30"}, {label:"Karen", data:"25"}, {label:"Mike", data:"20"}], Year:"Two"});

I have pulled out a ist for the combobox and passed it to a function that puts together the above.

However just not sure on the syntax. My code goes something like this:

Code:

function populate_datagrid2(populate_sql,arrayFields,arraySequence,arrayType,arrayComboLists):Array {

mdm.Forms.CTBCC.callFunction("_root.check_sql", populate_sql+"|0", "|")

var total_count = mdm.Database.MySQL.getRecordCount();

var dataSet = mdm.Database.MySQL.getData();

var rows=0;
var arr_listing:Array = new Array();
for (rows=0;rows<total_count;rows++)
{
var cols=0;
var col_count = arrayFields.length;
var assoc_array:Object = new Object();
for (cols=0;cols<col_count;cols++) {
if (arrayType[cols]=="Text") {
assoc_array[arrayFields[cols]] = dataSet[rows][arraySequence[cols]];
} else if (arrayType[cols]=="List") {
// Move the selected value to the top
assoc_array[arrayFields[cols]] = reorder(arrayComboLists, dataSet[rows][arraySequence[cols]]);
}

}
arr_listing.push(assoc_array);

}
return arr_listing;


}

I have essentially copied the reorder code into the fash file to specifically handle each combobox.

[neatgadgets]

I've finally got back to working with this and have managed to get everything going apart from one small but important part. The labels are not showing in any of the drop down boxes. I have traced the data and all is correct. I have setup the cellrenderer MovieClip in the Library, and there is an instance of the CheckBox in the Library.

I did note that the icon next to the instance of the ComboBox in the library was different so I copied the ComboBox fom the cars_flash-db.fla to my fla file. This made no difference.

The other difference is that I have the CellRenderer as file in the root with the fla, but I have relfected this difference in the properties.

Has anyone got any ideas why the data is not displaying in each of the drop downs?