Hereâs an extension to ComboBox that will set the selected item based on
inspection of its 'labelField' or 'labelFunction' properties. It plays nice
with databinding. Comments welcome.
DefaultableComboBox.mxml code below, use it by binding/setting
'selectedOption' like this:
<mx:Form>
<mx:Object id="pageModel">
<editor>{editorInput.selectedItem}</editor>
</mx:Object>
<c:DefaultableComboBox id="editorInput" labelField="name" dataProvider="{ users
}" selectedOption="{ pageModel.editor }"/>
</mx:Form>
DefaultableComboBox.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:ComboBox xmlns:mx="http://www.macromedia.com/2003/mxml";>
<mx:Script>
<![CDATA[
function set selectedOption(item:Object)
{
selectedIndex = indexOf(item);
}
function indexOf(item:Object)
{
if (item == null) return -1;
var list = this;
if (labelFunction == undefined)
{
labelFunction = function(item)
{
return item[list.labelField];
}
}
var value = labelFunction(item);
if (value == undefined) return;
for (var p in dataProvider)
{
if (labelFunction(dataProvider[p]) == value)
{
return p;
}
}
return -1;
}
]]>
</mx:Script>
</mx:ComboBox>
________________________________________
From: Matt Chotin [mailto:[EMAIL PROTECTED]
Sent: Wednesday, February 09, 2005 1:26 PM
To: [email protected]
Cc: Alex Cruikshank
Subject: RE: [flexcoders] form databinding strategies
The List classes donât choose selected items based on text. Youâll need
to find the compute the selectedIndex yourself.
<mx:Script>
 function search(arrToSearch : Array, field : String, value) : Number
 {
ÂÂÂ for (var idx = 0; idx < arrToSearch.length; ++idx)
ÂÂÂ {
ÂÂÂÂÂÂ if (arrToSearch[idx][field] == value) return idx;
ÂÂÂ }
ÂÂÂ return -1;
 }
</mx:Script>
<mx:ComboBox selectedIndex="{ search(users.user, ânameâ,
editableModel.owner.name) }" â>
Something like that, feel free to do it more efficiently â
Matt
________________________________________
From: Alon J Salant [mailto:[EMAIL PROTECTED]
Sent: Wednesday, February 09, 2005 11:42 AM
To: [email protected]
Cc: Alex Cruikshank
Subject: [flexcoders] form databinding strategies
Hey all,
As always, please refer me to previous posts or documentation if this
has been addressed elsewhere. I've searched quite a bit but to my
surprise have not found this topic addressed...
Our Flex application performs a lot of standard CRUD-style operations:
get a list of things, edit one or more, save changes,...
Our forms have TextInput, DateField, ComboBox and CheckBox fields, some
of which, like ComboBox and CheckBox have options populated by
DataProviders.
I'm looking for 'the right way' to:
1. populate form options from dataproviders
2. set field values bound to a backing object
Seems pretty straightforward, right?
I've been having problems figuring out the right way to have a ComboBox
default to the value set in the backing object.
In the web world, I am used to frameworks that take care of setting form
control settings to values of the object/s backing the form. I have not
figured out how to do this in Flex without writing code for each
ComboBox/RadioButtonGroup,...
Am I missing something in Flex or does someone on this list have a
recommended approach for accomplishing this?
Here's a simple example of what I am trying to do. Is there an attribute
for the ComboBox that I can set that will cause the right item to be
selected in the list. 'text' obviously is not it.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml";>
ÂÂ <mx:Model id="users">
ÂÂÂÂ <user>
ÂÂÂÂÂÂÂ <id>1</id>
ÂÂÂÂÂÂÂ <name>Alex</name>
ÂÂÂÂ </user>
ÂÂÂÂ <user>
ÂÂÂÂÂÂÂ <id>2</id>
ÂÂÂÂÂÂÂ <name>Don</name>
ÂÂÂÂ </user>
ÂÂÂÂ <user>
ÂÂÂÂÂÂÂ <id>3</id>
ÂÂÂÂÂÂÂ <name>Alon</name>
ÂÂÂÂ </user>
ÂÂ </mx:Model>
ÂÂ <mx:Model id="editableModel">
ÂÂÂÂ <name>Thing</name>
ÂÂÂÂ <owner>
ÂÂÂÂÂÂÂ <id>3</id>
ÂÂÂÂÂÂÂ <name>Alon</name>
ÂÂÂÂ </owner>
ÂÂÂÂ <user>
ÂÂÂÂÂÂÂ <id>2</id>
ÂÂÂÂÂÂÂ <name>Don</name>
ÂÂÂÂ </user>
ÂÂ </mx:Model>
 <mx:Form>
ÂÂÂ <mx:FormItem label="Name" width="100%">
ÂÂÂÂÂ <mx:TextInput text="{ editableModel.name }" />
ÂÂÂ </mx:FormItem>
ÂÂÂ <mx:FormItem label="Owner" width="100%">
ÂÂÂÂÂ <mx:ComboBox text="{ editableModel.owner.name }" labelField="name"
>
ÂÂÂÂÂÂÂ <mx:dataProvider>{ users.user }</mx:dataProvider>
ÂÂÂÂÂ </mx:ComboBox>
ÂÂÂ </mx:FormItem>
 </mx:Form>
</mx:Application>
Thanks,
Alon
[EMAIL PROTECTED]
Yahoo! Groups Sponsor
ADVERTISEMENT
________________________________________
Yahoo! Groups Links
â To visit your group on the web, go to:
http://groups.yahoo.com/group/flexcoders/
Â
â To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
Â
â Your use of Yahoo! Groups is subject to the Yahoo! Terms of Service.
