asked on

how to aviod entering text in ComboBox?

Hello experts,
In my DataGrid i am using
public class ComboBoxEditor extends ComboBox implements IFactory. When i click on ComboBox, how to aviod entering text so that i can select item from ComboBox itself.
Is there any property to set?

Thanks,
Alpita

dgofman

You need to assign your component to itemEditor and itemRenderer mapped to mx.controls.Label

<mx:AdvancedDataGridColumn itemEditor="ComboBoxEditor "/>

Alpita

ASKER

Here is my code snippet attached. MainAPP.mxml and ATTDataGrid.as.
Could you please let me know how this applies for my code?

Alpita

MainApp.mxml:
----------------
<s:ArrayCollection id="dsyslogColumns">
			<fx:Object dataField="action" width="39"  headerText="Action" dataType="Action" editable="false" headerWrap="true" />
			<fx:Object dataField="message" width="190" headerText="Description" dataType="String" editable="true" headerWrap="true" />
			<fx:Object dataField="severity" width="70" dataType="ArrayCollection" dataProvider="{this.severityColl}" dropdownWidth="90"  headerText="Severity" editable="true"/>
			<fx:Object dataField="vendorType" width="90" dataType="ArrayCollection" dataProvider="{this.vendorTypeColl}" dropdownWidth="120"   headerText="Vendor" editable="true"/>
			<fx:Object dataField="status" width="91" headerText="Status" dataType="String" />
			<fx:Object dataField="oid" width="90" headerText="Corresponding Trap Number" dataType="String" wordWrap="true" headerWordWrap="true"/>
			<fx:Object dataField="sub_dateTime" width="105" headerText="Submission Date" dataType="String"/>
			<fx:Object dataField="trans_dateTime" width="105" headerText="Transaction Date" dataType="String"/>

		</s:ArrayCollection>
		
<mx:Canvas id="waitCvs">	
		<scpt:ATTDataGrid headerBackgroundSkin="@Embed(source='/assets/Panel_headerSkin.png')" headerStyleName="datagridHeader"  width="1022" 
						  height="385" id="searchGrid" dataProvider="{this.custInfoDetails}" editable="true" allowMultipleSelection="true" 
						  needImageColumn="false" variableRowHeight="true" wordWrap="true" />
	</mx:Canvas>

ATTDataGrid.as:
-----------------

var fieldType:String = columnDefinition.dataType ;
				if(fieldType == "ArrayCollection")
				{
					if(dataGridColumn.editable && columnDefinition.hasOwnProperty("dataProvider")) 
					{
						var comboBox:ComboBoxEditor;
						var dropdownWidth : int = dataGridColumn.width ;
						
						if(columnDefinition.hasOwnProperty("dropdownWidth"))
							dropdownWidth = Number(columnDefinition.dropdownWidth) ;
						
						if(columnDefinition.hasOwnProperty("listener") )
						{
							comboBox = new ComboBoxEditor( false, dataField, columnDefinition.listener, null, dropdownWidth );
						}
						else
						{
							comboBox = new ComboBoxEditor( false, dataField, null, null, dropdownWidth);
						}
						comboBox.dataProvider = columnDefinition.dataProvider;
						
						if(columnDefinition.hasOwnProperty("labelFunction"))
						{
							comboBox.labelFunction = columnDefinition.labelFunction;
						}
						comboBox.editable = dataGridColumn.editable;	                    	
						dataGridColumn.itemEditor = comboBox;
						dataGridColumn.editorDataField = "selectedItem"; 
					}
				}

Open in new window

dgofman

Check my example, that is answer on your question

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%" initialize="init()">
	<fx:Script>
		<![CDATA[
			import mx.controls.ComboBox;

			[Bindable]
			private var comboFactory:ClassFactory;
			[Bindable]
			private var dataProvider:Array;
			
			private function init():void{
				comboFactory = new ClassFactory(ComboBox);
				comboFactory.properties = {dataProvider:['item1', 'item2', 'item3']}
					
				dataProvider = [{col1:11,col2:12,col3:13},
								{col1:21,col2:22,col3:23},
								{col1:31,col2:32,col3:33}];
			}
		]]>
	</fx:Script>

	<mx:AdvancedDataGrid dataProvider="{dataProvider}" itemRenderer="mx.controls.Label" editable="true">
		<mx:columns>
			<mx:AdvancedDataGridColumn dataField="col1" itemEditor="{comboFactory}"/>
			<mx:AdvancedDataGridColumn dataField="col2" itemEditor="{comboFactory}"/>
			<mx:AdvancedDataGridColumn dataField="col3" itemEditor="{comboFactory}"/>
		</mx:columns>
	</mx:AdvancedDataGrid>
</s:Application>

Open in new window

Alpita

ASKER

In my code , i am using Custom ComboBox component and Custom DataGrid.
I think this not applies .
Here are those files attached. Please let me know any ideas.
ATTDataGrid.txt
ComboBoxEditor.txt

ASKER CERTIFIED SOLUTION

dgofman

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial