I have a combobox with multi selection. when i click on add button, which ever data is selected in the Combobox, those data has to be displayed in the another comboBox.
Please check the code and Can anyone of you please help me on this.
<mx:HBox>
<mx:Label width="140" text="{resourceManager.getString ('resources', 'settings_configuration_database_select_object_instance')}"/>
<mx:List id="obj_instance" enabled="true" allowMultipleSelection="true" width="164" height="70"/>
<mx:Spacer width="20"/>
<mx:Button label=">>"/>
<mx:List id="selected_instance" enabled="true" allowMultipleSelection="true" width="164" height="70"/>
</mx:HBox>
Thanks,
Ravi
What about:
<ov:HPButton label=">>">
<ov:click><![CDATA[
for each (var item:* in obj_instance.selectedItems)
selected_instance.dataProvider.addItem(item);
]]></ov:click>
</ov:HPButton>
Of course, you'll have to make sure that the dataProvider of instance is something reasonable (like an ArrayCollection)…
Related
I have two tilelists in my mxml application. The items (image and a label) get rendered by an itemrenderer. The functionality I want to achieve: drag image from tilelist #1 and drop it on tilelist #2 (and then a httpservice with sql query will be launched).
How would I tackle this problem? (high level info would suffice).
The main issue I have is that I don't know how to call methods from the main to my itemrenderer. I would like to code the d&d functionality within the renderer but I have no clue how to access watchlist #2 from within the renderer.
Relevant code in main.mxml:
<s:Panel id="panel" width="100%" height="100%" title="Watchlist">
<s:layout>
<s:VerticalLayout paddingBottom="5" paddingLeft="20"
paddingRight="20" paddingTop="5"/>
</s:layout>
<s:Label width="20%" fontSize="17" fontWeight="bold" text="Your watched movies"/>
<mx:TileList id="myWatchedList_tile" height="360" borderVisible="false" width="80%"
columnCount="5" columnWidth="200"
itemRenderer="components.TileListItemRenderer" rowCount="1" rowHeight="360"/>
<s:Label width="20%" fontSize="17" fontWeight="bold" text="Your to watch movies"/>
<mx:TileList id="myToWatchList_tile" height="360" borderVisible="false" width="80%"
columnCount="5" columnWidth="200"
itemRenderer="components.TileListItemRenderer" rowCount="1" rowHeight="360" />
</s:Panel>
The itemrenderer:
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
borderVisible="false" horizontalAlign="center" verticalAlign="middle"
xmlns:components="components.*">
<mx:Image source="{data.poster_url}" />
<mx:Label text="{data.movie_title}" height="20" />
</mx:VBox>
You can access methods outside of your item renderer using the outerDocument object. Make sure they are (scope)public methods.
http://www.adobe.com/devnet/flex/articles/itemrenderers_pt1.edu.html
Alternative solution might be to use spark lists instead (with a TileLayout) - then you can easily use drag+drop between lists: http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7cfd.html
..and launch service in response to 'drop' event (event will have reference to dropped image)
I have a form that looks like the following:
<mx:HBox width="100%" horizontalAlign="center" verticalAlign="middle">
<mx:Panel horizontalAlign="center"
title="{resourceManager.getString('Resources','views.login.title')}"
verticalAlign="middle">
<mx:Form id="loginForm" defaultButton="{loginButton}">
<mx:FormItem label="{resourceManager.getString('Resources','views.login.ip')}">
<mx:Label id="url" text="{url}"/>
</mx:FormItem>
<mx:FormItem label="{resourceManager.getString('Resources','views.login.username')}"
required="true">
<mx:TextInput id="username"/>
</mx:FormItem>
<mx:FormItem label="{resourceManager.getString('Resources','views.login.password')}"
required="true">
<mx:TextInput id="password" displayAsPassword="true"/>
</mx:FormItem>
</mx:Form>
<mx:FormItem direction="horizontal" width="100%" horizontalAlign="right" paddingBottom="2" paddingRight="2">
<mx:Button id="loginButton"
label="{resourceManager.getString('Resources','views.login.loginBtn')}"/>
</mx:FormItem>
</mx:Panel>
</mx:HBox>
The behavior I experince some times (not always) is when I tab from username to password and then try to hit "Enter" the Botton's click callback does not get called. If I click on the label (id is "url") then go into any of the textboxes, "Enter" key works just fine. I am assuming that the form somehow keep loosing focus. I would appreciate any idea about solving this problem.
I experienced the same issue recently, did you find the root cause? I found a workaround is set the form defaultButton in creationComplete handler instead of on the mxml tag. I saw this issue in Flex4.1, I don't see it in Flex 3.6. I haven't try flex 4.6 though.
In my application, I have a List that uses an item renderer.
The renderer has two controls inside a Grid. I want the user to be able to tab through the TextAreas. However, I noticed that I need to tab twice to move to the next TextArea. I think it may be tabbing to the Label. How do I exclude the Label from the tabbing?
The code is below:
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
height="100%"
implements="mx.controls.listClasses.IDropInListItemRenderer"
width="100%">
<mx:GridItem height="100%"
colSpan="5"
width="100%">
<mx:VBox width="100%">
<mx:TextArea id="txtFeedback"
tabIndex="0"
wordWrap="true"
maxChars="4000"
fontWeight="bold"
width="100%"/>
<mx:Label fontSize="8" text="Thanks"/>
</mx:VBox>
</mx:GridItem>
</mx:GridRow>
</mx:Grid>
To exclude component from tab order set tabEnabled property to false
Just tell the focus to keep on keepin' on when it gets to the label:
<mx:Label fontSize="8" text="Thanks"
focusIn="{focusManager.moveFocus(mx.events.FocusRequestDirection.FORWARD)}"/>
Make sense? :)
I want to create a tilelist in which there would be different canvas or vbox etc, and i want to make them drag able.
I wrote a code to do this, but the output does not shows anything in a list.
<mx:TileList width="1500" height="1000" dragMoveEnabled="true"
selectable="true" selectionColor="#FFFFFF"
dragEnabled="true" dropEnabled="true"
columnCount="1" rowHeight="160">
<mx:dataProvider>
<mx:Array>
<mx:Canvas width="1450" height="100">
<mx:Button label="Testin the buttong"/>
</mx:Canvas>
<mx:Canvas width="1450" height="100">
<mx:Button label="Testin"/>
</mx:Canvas>
</mx:Array>
</mx:dataProvider>
</mx:TileList>
How can I fix this? Or let me know what m i doing wrong here?
Thanks and Regards
Zeeshan
Your dataProvider should have objects of some sort. In theory they could be instance of a Canvas, but that would be highly unusual to use a visual component as the dataProvider. What you want to do is read up on itemRenderers. an itemRenderer is a component that will be used to renderer each instance of your dataProvider.
Try something like this:
<mx:script><[[
public var mydb : Array = [
{label: 'Testin the buttong'},
{label: 'Testin'}
]
]]></mx:script>
<mx:TileList width="1500" height="1000" dragMoveEnabled="true"
selectable="true" selectionColor="#FFFFFF"
dragEnabled="true" dropEnabled="true"
columnCount="1" rowHeight="160" dataProvider="{mydp}">
<mx:itemRenderer>
<mx:Component>
<mx:Canvas width="1450" height="100">
<mx:Button label="{data.label}"/>
</mx:Canvas>
</mx:Component>
</mx:itemRenderer>
</mx:TileList>
In short I Defined the dataProvider in script with generic objects. And I defined an itemRenderer in-line. Something like this should at least have something show up.
I'm not sure if a Canvas can be draggable, as it doesn't usually have anything to click on to start the drag. You may want to consider a TitleWindow.
I wrote the code in browser, so standard disclaimers apply.
I have the following MXML:
<mx:State name="myState">
<mx:AddChild relativeTo="{myhbox}" position="after">
<mx:Box verticalAlign="middle" horizontalAlign="center" width="100%" height="100%">
<mx:Form id="myForm" width="479" verticalScrollPolicy="off" horizontalScrollPolicy="off">
<mx:FormItem label="My Label:" fontWeight="bold" id="myLabel" direction="vertical">
<mx:TextInput id="myTextInput" width="282" />
<mx:HBox>
<mx:Button label="Go" click="go();" id="goButton" />
</mx:HBox>
</mx:FormItem>
</mx:Form>
</mx:Box>
</mx:AddChild>
</mx:State>
How do I set focus on the TextInput field using <mx:SetProperty/>? I've tried the following, but it only results in the field being highlighted -- the cursor does not appear in the TextInput:
<mx:SetProperty target="{stage}" name="focus" value="{myTextInput}"/>
Long story short, I want the cursor to appear in the field.
UPDATE: I figured it out. See comments for solution.
I try to avoid using the AddChild state tag. It's usually better to put all that in a component, and use SetProperty to set visible and includeInLayout when you want it to display.
You can always override visible in your custom component to set the focus to the field. Or create a custom setter than does the same thing
public function set show(value:Boolean):void
{
visible = true;
includeInLayout = true;
if (value)
myFunctionThatSetsTheFocus();
}
Add a "creationComplete" to the TextInput and had it call a method that setFocus on the TextInput