MXML Components and ActionScript Classes

Hello,
I am fairly new to Flex and OOP and am confused on how some parts of OOP work.
I have a Spark TextInput Component with an id which equals "test".
I also have a function that takes "test.text", appends a string to and and puts the resulting value into another TestInput called test2.
How can I move the "appendPhrase()" function into a class so that it would still accept values from "test" and change the "text2" values?
I tried creating a function that would assign the value of the varaible in the class using classname.variable name, made it bindable, and assigned
the text value of the textinput that value, but I was wondering if there was any other way I could do that?
~~~~~~~~~~~~~~~~Version1~~~~~~~~~~~~~~~~~~~~~
<fx:Script>
    private function appendPhrase():void
        test2.text = test.text + " was added";
</fx:Script>
<s:TextInput x="0" y="0" id="test" />
<s:TextInput x="0" y="10" id="test2" />
<s:Button click="appendPhrase();" />
~~~~~~~~~~~~~~~~~~Version 2:~~~~~~~~~~~~~~~~~
function in class:
public class ChangeString
    [Bindable]
    public var text:String;
    private function appendPhrase(firstString:Object):void
       text = firstString.text + " was added";
main.mxml:
[Bindable]
public var changed:Object = new ChangeString();
<s:TextInput x="0" y="0" id="test" click="changeValue(test.text)" />
<s:TextInput x="0" y="10" id="test2" text="{changed.text}"/>

package models
          [Bindable]
          public class MyViewModel
                    public var text:String "Hello ";
                    public function appendText(t:String):String
                              this.text = this.text + t;
                              return this.text;
<fx:Script>
<![CDATA[
import models.MyViewModel;
[Bindable]
public var model:MyViewModel = new MyViewModel();
]]>
</fx:Script>
<s:TextInput id="test" x="0" y="0" click="this.model.appendText(this.test.text)" text="World" />
<s:TextInput id="test2" x="0" y="10" text="{this.model.text}" />
I would go about it a little differently maybe. I would use the model class as a data holder, and use a private local method, utility class, or controller class to modify values on the model (data holder class).

Similar Messages

  • Converting MXML Components to ActionScript Classes

    I'm in the process of converting most (if not all) of my MXML
    components to Action Script classes. I've found this is easy, and
    doesn't require a lot of extra code when extending a simple
    container or control. However, several of my MXML components have
    several nested containers and controls - i.e. a component that
    contains several Labels, a ComboBox, a TextInput, a Button, and a
    DataGrid, plus several other containers needed for layout. To code
    the layout of all these containers and controls using MXML, it uses
    about 16 lines of code. To code the layout in ActionScript, it
    takes about 50+ lines of code (see attached).
    I'm just wondering if there are any best practices for
    creating ActionScript classes that include several (or even A LOT
    OF) containers and controls. It's very easy to layout in MXML, and
    is more visibly pleasing to look at and understand, but I feel it
    is best practice to code components as ActionScript classes. I know
    I should be using MVC, but it's a little late to rewrite the entire
    application now.
    Any thoughts?

    I can't specifically speak to how to write layout code in
    ActionScript, but you can look at the generated code that Flex
    creates to get an idea of how Flex does it. When you compile an
    app, the Flex compiler takes your MXML input and converts it to
    ActionScript classes before compiling the entire set of classes
    into a SWF. Because of this, you can look at the interim
    ActionScript code.
    You do this by setting the keep-generated-actionscript
    compiler option to true and looking in the /generated directory.
    hth,
    matt horn
    flex docs

  • How to Access MXML components  from ActionScript class

    Hi ,
    I am having a Application Conataner , in which i am having a Form Container with some Label in it .
    This is some thing similar to this as shown :
    <Mx:Application>
    <Mx:Form>
    <Mx:Label text="Hello world"/>
    </Mx:Form>
    </Mx:Application>
    Can any body please let me know how can i access this Form's Label , from an ActionScript class .
    catch(error:*)
    // Here i want to access these Objects and set data to that Label .
    Basically My requirement is that iinside the catch block of my ActionScript class , i want to set some text to the Label , Please
    let me know if this is possible or not also ??
    Waiting for your Replies .

    Hi these both are not same these refer to different one...
    Well let me explain...
    Application.application.myCustomComp.myLabel.text = "sometext"; sets the label "myLabel" which is present inside your customcomponent(which is in main application).
    Application.application.myLabel.text = "sometext"; sets the label "myLabel" which is present directly inside your main application.
    <?xml version="1.0"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Label id="myLabel"  text=""/> // So inorder to set the label(myLabel) present here you will use directly the 2nd line of code.
    <mx:CustomComp id="myCustomComp" /> // So inorder to set the label(myLabel) present inside this component you use 1st line of code.
    </mx:Application>
    Hope now its clear.
    If this post answers your question or helps, please kindly mark it as such.
    Thanks,
    Bhasker Chari

  • Dynamically add custom MXML components in Actionscript

    As there's no constructor for custom MXML components, how to
    dynamically add it as a child using ActionScript?
    I'm looking for some alternative to avoid the need to rewrite
    the entire existent component in ActionScript just to add it this
    feature (a constructor). PopManager is not an alternative...
    Is there any way?
    The case/situation:
    I have a custom MXML component that needs to be dinamically
    added to a NativeWindow created using ActionScript.
    Thanks a lot!
    Vicente Junior
    Independent Web Developer
    http://teclandoalto.blogspot.com

    mxml classes get generated into AS classes with a default
    constructor.
    In fact, there is essentially no difference between an AS
    component and an mxml component, they can be used exactly the same
    way.
    Tracy

  • WebService and ActionScript class

    Hi,
    I am trying to create an actionscript class to use it in my
    mxml component.
    I have the floowing code which works perfectly.
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application creationComplete="HTTPdecision.send()"
    xmlns:mx="
    http://www.adobe.com/2006/mxml"
    width="870">
    <mx:Script>
    <![CDATA[
    import mx.rpc.events.ResultEvent;
    import com.sourcepulse.com.dtRulesClass;
    private var endURI:XML;
    private var URI:XMLList;
    private function setURI(event:ResultEvent):void
    endURI = event.result as XML;
    URI = new XMLList(endURI.endpoint.webservice.location);
    Test.endpointURI= URI.toString();
    ]]>
    </mx:Script>
    <mx:HTTPService id="HTTPdecision"
    url="../XML/endpointURI.xml" resultFormat="e4x"
    result="setURI(event)" />
    <mx:WebService service="amazon" port="amazonSOAP"
    id="Test"
    wsdl="
    http://localhost:9081/ezbuyer/amazon/services/amazonSOAP/wsdl/amazon.wsdl"
    >
    <mx:operation name="getISBNDetails">
    <mx:request xmlns="">
    <isbnSearchRequest>
    <bookName>{txtBookName.text}</bookName>
    <category>{txtCategory.text}</category>
    </isbnSearchRequest>
    </mx:request>
    </mx:operation>
    </mx:WebService>
    <mx:Panel x="100" y="100" width="600" height="500"
    layout="absolute"
    title="Amazon WebService">
    <mx:VBox height="400">
    <mx:VBox>
    <mx:Form width="400" height="145" autoLayout="true">
    <mx:FormHeading label="Specify the following:"/>
    <mx:FormItem width="307" label="BookName :">
    <mx:TextInput id="txtBookName"/>
    </mx:FormItem>
    <mx:FormItem width="308" label="Category :">
    <mx:TextInput id="txtCategory" />
    </mx:FormItem>
    <mx:FormItem width="312">
    <mx:Button label="Test"
    click="Test.getISBNDetails.send()"/>
    </mx:FormItem>
    </mx:Form>
    </mx:VBox>
    <mx:VBox>
    <mx:Form width="400" height="122" autoLayout="true">
    <mx:FormHeading label="Book Details:"/>
    <mx:FormItem width="307" label="ISBN :">
    <mx:Text text="{Test.getISBNDetails.lastResult.isbn}"
    />
    </mx:FormItem>
    <mx:FormItem width="308" label="Author :">
    <mx:Text text="{Test.getISBNDetails.lastResult.author}"
    />
    </mx:FormItem>
    </mx:Form>
    </mx:VBox>
    </mx:VBox>
    </mx:Panel>
    </mx:Application>
    Now instead of binding the input from the textboxes directly
    as in the above code
    <mx:request xmlns="">
    <isbnSearchRequest>
    <bookName>{txtBookName.text}</bookName>
    <category>{txtCategory.text}</category>
    </isbnSearchRequest>
    </mx:request>
    I created an actionscript class
    package com.xxxx.com
    public class simpleTest
    //Instance Variables
    private var bookName:String;
    private var category:String;
    public function simpleTest()
    function getBookName():String {
    return bookName;
    function setBookName(bookName:String):Void {
    this.bookName = bookName;
    function getCategory():String {
    return category;
    function setCategory(category:String):Void {
    this.category = category;
    How can I use this ActionScript class to use in
    <bookName>{txtBookName.text}</bookName>.
    Thanks in advance.

    I think you're close to achieving what you want... first I
    would change your getter and setter methods just a bit to make them
    properties. Second add the [Bindable] meta tag in front of one of
    each of the group of properties (i.e. you don't need it in front of
    both the get and set method, just one of them).
    i.e.
    [Bindable]
    public function get category():String {
    return category;
    public function set category(value:String):void{
    category = value;
    then in your mxml you can "bind" to each property you've
    defined in the class. so if you create a new instance of your
    simpleTest class called "test" you could do the following:
    <mx:Label text="{test.category}" />

  • Accessing MXML ArrayCollection from ActionScript class?

    I have an MXML file that has an arraycollection for my Tree
    component. I am overriding the updateDisplayList function in order
    to add lines to all of my nodes in the Tree.. however I can't seem
    to figure out how to access that ArrayCollection from inside the
    actionscript class?
    I have tried the methods used to pass variables between two
    MXML files (like a popup window - which I have used in the past and
    it works great).
    My actionscript class code is almost identical to this
    example here:
    http://www.iepl.net/treeControlSample/treeControlSample.html
    In the above example the data is static, but my data is going
    to change sometimes and I need access to the entire dataProvider
    (ArrayCollection) in order to make the lines work right.. this has
    been very frustrating for me! :)
    if anyone knows of a better way to achieve gettign lines to
    the siblings in a Tree.. please let me know!
    Any help would be super duper awesome!

    I have found the solution to this. My problem was similar to
    the one cheftimo was having in this post:
    http://www.adobe.com/cfusion/webforums/forum/messageview.cfm?forumid=60&catid=585&threadid =1367784&enterthread=y
    The answer is to import mx.core.Application into the
    component you are trying to access the variable from and then call
    it by using 'Application.application.<var name>'
    Thanks to Greg Lafrance!

  • Accesing mxml components from AS class

    Hello,
    on a CS6 <csxs:CSExtension> how do I refer to a component (say, a Button with id="myButton")  in the main view from an Actionscript class?
    The equivalent mx: way highlighted here: http://livedocs.adobe.com/flex/3/html/help.html?content=app_container_3.html)
    TIA,
    Davide

    Apparently, the correct way is: FlexGlobals.topLevelApplication
    (it seems like FB has some problems with both com.adobe.photoshop.Application and mx.core.Application.application in the same class - at least it fired a bunch of weird errors to me)
    Davide

  • Mxml components not compiled into swc?

    Hi, I am using Flash Builder(Flex 4) and i am having issues compiling mxml components into swc.
    My scenario:
    I created Flex Library project, added some mxml components and actionsript classes.
    I created separate Flex project and added swc file to project's library path.
    I can only import actionscript classes from my library.
    ActionScript classes are compiled and bundled in the swc as expected, but all mxml components are not compiled into the swc.
    Do you have the same issues compiling mxml components?
    I am using Flash Builder Version 4.0 (build 253292).

    My team occasionally sees issues with missing classes in a similar setup, although I can't confirm that it has been limited to MXML (and no one has been able to reliably reproduce).
    I suspect our problem is the "includeAllClasses" property in .flexLibProperties (Project->Properties->Flex Library Build Path->Classes->Include all classes from all source paths)--it seems to not reliably compile in newly added classes.  Our workaround right now is to instead click "Select classes to include in the library" and toggle our source directory every time classes are added, at least until we script our own build tasks.  Looking through Jira I see this is a common issue: https://bugs.adobe.com/jira/browse/FB-23514 (and a few others).
    Hope this helps,

  • Custom Components and passing arguments

    This afternoon i got a great answer regarding the use of custom MXML components and calling a function back in the main application file. I can accomplish this now by using parentDocument BUT I need to pass the name of a function(for filtering) as a parameter of the function call in the custom component. Below are the two code fragments.
    Custom Component Code
    <mx:LinkButton label="10% off or more" click="parentDocument.filterFunction(showTenPercent)" />
    Main App Code
    public function filterFunction(functionName:Function):void {
    merchantDG.visible=true;
    merchantData.filterFunction=functionName;
    merchantData.refresh();
                public function showTenPercent(item:Object):Boolean {
                        return (item.merchantOfferCategory=="10%");
    The filterFunction in the main App is called by multiple components so I believe I need to keep in centralized in the main app. There is probably another way to do this but I am building my Flex skills slowly and need to understand how to do this. As the code is now, I get an error about functions and strings.

    I believe instead of calling the function from inside the custom component you need to do this from inside your main application whenever you're initiating the custom component.
    for ex.
    <custom:LinkBtnCustom label="10% off or more"  click="filterFunction(showTenPercent)"/>
    this way you don't need the parentDocument prefix.

  • Problem in contacting MXML from ActionScript class catch block

    When ever there is a exception inside the ActionScript class , i want to access the MXML TextInputId and dispplay an error Message on to it , but i am unable to succeed.
    This is the code i am using
    <mx:Application>
    <mx:TextInput id="MyTI"/>
    </mx:Application>
    Inside ActionScript class :
    catch(error:Error)
    Application.application.MyTI.text="Error Submitting Data"
    Need your suggestions to implement this .
    Thanks in advance

    Hi Kiran,
    It should defenitely wor for you...
    Try to debug and check whether the control is entering into the catch block.
    Thanks,
    Bhasker Chari

  • Passing VARs between MXML Application and MXML components!

    Hi,
    I'm trying to pass a variable between the MXML Application and the MXML Component with ValueObjects.
    But when i call the variable on the MXML Component it is null!
    ValueObject Class Code:
    package valueObjects
        [Bindable]   
        public class MyGlobalVars
            public var NomeGaleria: String;
            public function MyGlobalVars()
    MXML Application Code:
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  xmlns:comp="components.*" layout="vertical" height="100%" width="100%" >
    <mx:Script>
        <![CDATA[
            import valueObjects.MyGlobalVars;
            import mx.managers.PopUpManager;
            import mx.core.Container;
            [Bindable]
            public var nomeGaleria:MyGlobalVars;
            private function AbreGaleria():void{
                  nomeGaleria=new MyGlobalVars();
                nomeGaleria.NomeGaleria = "Moda";
                PopUpManager.addPopUp(new galeriaImagens(),this,true);
        ]]>
    </mx:Script>
    <mx:Panel height="673" width="839" verticalAlign="middle" borderStyle="none" layout="absolute">
        <mx:Canvas id="SMGaleria" width="815" height="30" x="2" y="98"">
            <mx:LinkButton x="474" y="5" label="moda" click="AbreGaleria()"/>   
         </mx:Canvas>
        <mx:ViewStack id="content" height="440" width="815" borderStyle="none" x="2" y="128">
            <comp:galeriaImagens id="GaleriaImagens" x="0" y="5" strGaleria="{nomeGaleria}"/>
        </mx:ViewStack>
    </mx:Panel>
    </mx:Application>
    MXML Component Code:
    <?xml version="1.0" encoding="utf-8"?>
    <mx:TitleWindow  xmlns:mx="http://www.adobe.com/2006/mxml"
        showCloseButton="true" creationComplete="CenterMe()" backgroundColor="#000000" xmlns:components="components.*" >
    <mx:Script>
        <![CDATA[
            import valueObjects.MyGlobalVars;
            import mx.controls.Alert;
            [Bindable]
            public var strGaleria:String;
            private function CenterMe(): void{
                 Alert.show(strGaleria);
        ]]>
    </mx:Script>
    </mx:TitleWindow>
    On the MXML component the value of strGaleria is null! It would not have to be: Moda??

    You may need to change your code as follows:
    <comp:galeriaImagens id="GaleriaImagens" x="0" y="5" strGaleria="{nomeGaleria.NomeGaleria}"/>
    Previously you had set strGaleria to the value of the object, not the string within the object.
    But I think you will still have a problem because function AbreGaleria will not be called until the user clicks the link button, and only then will NomeGaleria have a value, so I would set a default value as follows, otherwise at app launch it will be null:
    public var NomeGaleria: String = "";
    or  if that does not work
    public var NomeGaleria: String = " ";
    Another possible problem is that you are calling this code at the component creationComplete, but the LinkButton has not been clicked yet, so the value object string value has not been set, so the alert will not display anything:
    private function CenterMe():void{
        Alert.show(strGaleria);
    I think you need to reorganize some things here.
    If this post answers your question or helps, please mark it as such.

  • Event in ActionScript Class not accessible by MXML Component

    I am implementing an ActionScript Class in my MXML Component,
    but it can't see the Event I'm specifying. I'm getting the
    following Error when I compile my application:
    Cannot resolve attribute 'myEvent' for component type
    myClass.
    How do I make the Event available to the MXML component?
    Thanks.

    Guess the compiler has a problem with semi-colons after the
    Event declarations. I removed the semi-colons, and was able to
    compile.

  • Is there a simple example, I can see how to connect to a db using Flash 8 and actionscript? (not with components)

    I have been looking all over for a simple "hello world"
    example, on how to connect to a database, and pass a param, and
    return a dataset. I would like one that does not use components.
    (Actionscript only). That uses ColdFusion 7.x and Flash 8. Can
    anyone point me to one?

    Thanks Craig, I saw that example, but it was meant for Flash
    MX, and according to the Flash 8 documentation, the NetServices is
    now deprecated. Anyway, I posted my question on another site and
    some supplied me with a simple example. Here is the url if anyone
    is interested...
    sample

  • Code beautifier for MXML and ActionScript?

    How do people reformat ugly code in FlexBuilder? I can eaisly
    format my Java, JSP, and XML in the same Eclipse environment, but
    why not MXML and ActionScript? I am very surprised this feature is
    missing. It's quite common that I copy code snippets from somewhere
    to FlexBuilder which are not well formatted.

    Hey guys, Be patient...
    Don't forget the years of Java development that have advanced
    Eclipse, not counting the 40 mil or so in prior development that
    IBM donated when they ported and open sourced their Visual Age
    product line. I used VA it back in 96 and it was slow and clunky,
    and never would have sold against Borland's Java products.
    I'm sure the decision was consciously made by Adobe product
    management to get core feature functionality out and concentrate on
    other stuff for the next release.
    The FLEX team has done a great job and for some who have ever
    been under their delivery schedule for the size of this
    undertaking, many can appreciate how well they have done.
    Also, considering that many eclipse plugins that are free are
    worth what you pay for them (I have tested quite a few), the paltry
    $700 bucks for FLEX and the fact that it has a great debugger and
    profiler makes it worth it.
    One final opinion, no matter what anyone says, software is
    not free. You pay in time, learning curve, more time, and
    sometimes, just plain old tail chasing!
    I'm not really being critical, both of you have valid points,
    just be patient, they'll get there.

  • Class for Purchase order item components and Production order components

    I'm looking for a some classes.   I'm very new to objects, so I could be searching for them incorrectly.
    The first class I'm looking for is a purchase order class that contains the item components.  I've looked at CL_PO_ITEM_HANDLE_MM and CL_PO_HEADER_HANDLE_MM.  I couldn't find components as a part of either of the classes.
    The second one I'm looking for is not as critical.  It is for the components for a production order.   I have a function module: BAPI_PRODORD_GET_DETAIL that gets the components for the order.  However, to take advantage of objects - I read somewhere - that if possible I should avoid calling a function module.
    Any help that you could give would be greatly appreciated.
    Thank you!
    Michelle

    Hello Michelle
    I do not think there are already classes available on ERP 6.0 for reading production order (yet I might be wrong...). However, regarding purchase order you are already on the right track.
    *& Report  ZUS_SDN_OO_READ_PO
    *& Thread: Class for Purchase order item components and Production order components
    *& <a class="jive_macro jive_macro_thread" href="" __jive_macro_name="thread" modifiedtitle="true" __default_attr="1206523"></a>
    "& NOTE: Coding adapted from BAPI_PO_GETDETAIL1
    REPORT  zus_sdn_oo_read_po.
    TYPE-POOLS: abap, mmpur.
    PARAMETER:
      p_ebeln   TYPE ebeln  DEFAULT '3000000045'.
    DATA: gs_document    TYPE mepo_document,
          go_po          TYPE REF TO cl_po_header_handle_mm,
          gs_header      TYPE mepoheader,
          gd_tcode       TYPE sy-tcode,
          gd_result      TYPE mmpur_bool.
    data: gt_items       type PURCHASE_ORDER_ITEMS,
          gs_itm         type PURCHASE_ORDER_ITEM,
          gs_item        type mepoitem.
    START-OF-SELECTION.
    *  prepare creation of PO instance
      gs_document-doc_type    = 'F'.
      gs_document-process     = mmpur_po_process.
      gs_document-trtyp       = 'A'.  " anz.  => display
      gs_document-doc_key(10) = p_ebeln.
    *  object creation and initialization
    **  l_ebeln = purchaseorder.
      CREATE OBJECT go_po.
      CALL METHOD go_po->po_initialize( im_document = gs_document ).
      CALL METHOD go_po->set_po_number( im_po_number = p_ebeln ).
      CALL METHOD go_po->set_state( cl_po_header_handle_mm=>c_available ).
    *  read purchase order from database
      gd_tcode = 'ME23N'.
      CALL METHOD go_po->po_read
        EXPORTING
          im_tcode     = gd_tcode
          im_trtyp     = gs_document-trtyp
          im_aktyp     = gs_document-trtyp
          im_po_number = p_ebeln
          im_document  = gs_document
        IMPORTING
          ex_result    = gd_result.
    *  there was a problem in reading the PO
      IF ( gd_result EQ mmpur_no ).
    **    l_messages = l_handler->get_list_for_bapi( ).
    **    PERFORM return TABLES l_messages return
    **                          poitem poschedule poaccount.
    **    CALL METHOD l_po->po_close( ).
      ELSE.
        gs_header = go_po->if_purchase_order_mm~get_data( ).
        WRITE: / gs_header-ebeln,
                 gs_header-bukrs,
                 gs_header-bsart,
                 gs_header-lifnr.
      ENDIF.
      gt_items = go_po->if_purchase_order_mm~get_items( ).
      LOOP AT gt_items INTO gs_itm.
        gs_item = gs_itm-item->get_data( ).
        write: / gs_item-ebelp,
                 gs_item-matnr,
                 gs_item-menge.
      ENDLOOP.
    END-OF-SELECTION.
    Regards
      Uwe

Maybe you are looking for

  • Single digit years (with a space), converts the space to zero ???????

    Date vadildation accepts single digit years (with a space) and converts the space to zero. How do we stop converting the space into zero. Thanks

  • Photosmart 7520 not printing

    My Photosmart 7520 is printing blanks after just getting its ink changed and also printed its ink report right after perfectly fine. What is going on? I need help ASAP. I have a final due in two days!

  • Request additional allocation of dynamic memory

    Hyper-V 2012 host Server 2012 R2 guest The guest is configured for startup and minimum memory of 2 GB with a maximum memory of 64 GB.  Once per day a PowerShell script runs which uses 7-Zip.exe to compress some large files.  The 7-Zip command fails i

  • Sapccmsr register on Business Connector

    Hi, we want to monitor Business Connector 4.7 running on windows. so I download the OScol and sapccms agent and used the SAPNote 704349 used INSTALL WIN.SAR to install OScol and sapccmsr and then when I tried to register sapccmsr I am having followin

  • Will BO software support Microsoft SQL SERVER 2008 version in the future

    Hello, Currently, I do not see any support available for MS SQL Server 2008. Are there any plans for BO to support MS SQL SERVER 2008 in any roadmap documentation abhi