我有一个带有数据的简单 DataGrid。在其中一列中,我想使用 ComboBox 来编辑字段,而不是标准的编辑框。
我怎么做?我已经尝试了我在互联网上找到的所有类型的东西,但它们都无法简单地更新值。我会说这样做应该不会太难。
我有一个带有数据的简单 DataGrid。在其中一列中,我想使用 ComboBox 来编辑字段,而不是标准的编辑框。
我怎么做?我已经尝试了我在互联网上找到的所有类型的东西,但它们都无法简单地更新值。我会说这样做应该不会太难。
实际上,我自己也在这样做,并且使用 spark:DataGrid 它实际上比 halo 更容易一些 - 但两者都遵循相同的设置/架构。
从...开始:
spark.components.gridClasses.ComboBoxGridItemEditor;
根据您的数据设置的性质和/或这种编辑对您的应用程序的多产程度,您可以将其内联编写,因为大多数文档会在 <fx:component> 中建议,或者只是将其子类化(尽管在幕后这些是同一件事——后者更容易重用)。在我的场景中组合的数据是一个更大的父对象的子选择,所以我选择让自己更容易,并添加一个额外的属性dataField来模仿其他渲染器/编辑器——实际上只显示在单元格本身中(不处于编辑模式时)。
基本设置看起来或多或少是这样的(至少我的是这样):
public class AccountComboEditor extends ComboBoxGridItemEditor
{
private _dataField:String;
public function AccountComboEditor()
{
super();
//note - typically you wouldn't do "logic" in the view but it's simplified as an example
addEventListener(FlexEvent.CREATION_COMPLETE, onCreationComplete);
}
public function get dataField():String { return _dataField; }
public function set dataField(value:String):void
{
if (_dataField !=value) //dosomeadditionalvalidation();
_dataField = value;
}
override public function prepare():void
{
super.prepare();
if (data && dataField && comboBox) comboBox.labelField = data[dataField];
}
protected function onCreationComplete(event:FlexEvent):void
{
//now setup the dataProvider to your combo box -
//as a simple example mine comse out of a model
dataProvider = model.getCollection();
//this isn't done yet though - now you need a listener on the combo to know
//what item was selected, and then get that data_item (label) back onto this
//editor so it has something to show when the combo itself isn't in
//editor mode
}
}
所以真正的收获是设置组合框的labelField,无论是在子类内部还是在外部,如果您需要将其公开为附加属性。
下一部分是将其用作实际数据网格的mx.core.ClassFactory的一部分。一个简单的视图看起来类似于:
<s:DataGrid>
<fx:Script>
private function getMyEditor(dataField:String):ClassFactory
{
var cf:ClassFactory = new ClassFactory(AccountComboEditor);
cf.properties = {dataField : dataField };
return cf;
}
</fx:Script>
<s:columns>
<mx:ArrayList>
<s:GridColumn itemEditor="{getMyEditor('some_data_property')}" />
</mx:ArrayList>
</s:columns>
</s:DataGrid>
这个正在创建项目渲染器...文档将为您提供更多信息。
我想到了。我只想要一个简单的下拉框,而不是文本编辑字段。
以下代码确实想要我想要的:
<mx:DataGridColumn dataField="type" headerText="Type" editorDataField="value">
<mx:itemEditor>
<fx:Component>
<mx:ComboBox>
<mx:dataProvider>
<fx:String>Gauge</fx:String>
<fx:String>Graph</fx:String>
<fx:String>Indicator</fx:String>
</mx:dataProvider>
</mx:ComboBox>
</fx:Component>
</mx:itemEditor>
</mx:DataGridColumn>