2 Replies Latest reply on May 4, 2009 4:51 AM by Muzak

    How to send a message between two custom components

    noppanit

      I have a datagrid in one custom cuomponent which is.

                      <mx:Canvas id="customerGrid"
                          width="100%"
                          height="350">
                          <customer:CustomerGrid/>
                      </mx:Canvas>

       

                     <customer:CustomerDetail />

       

      The <customer:CustomerDetail  /> has a TextInput. How do I send a message from <customer:CustomerGrid /> over to <customer:CustomerDetail /> when the datagrid is clicked. When a user clicks the selectedItem I want that detail to display in the TextInput, which is in another component.

       

      I am looking in Restaurant Finder sample. It uses exactly like I wanted to do. However, it uses some kind of AccessibleText. Are there any easier way to implement it.

       

      Thanks

        • 1. Re: How to send a message between two custom components
          Srirangan

          A simple option would be to provide a hook i.e. a public method in either of the two components that can be used by the other to pass the message.

           

          A more wholesome solution would be to implement a common bus type system between all components. That'd be fun to do. :-)

          1 person found this helpful
          • 2. Re: How to send a message between two custom components
            Muzak Level 3

            One way to do it is to use the data property most components inherit and use bindings between the custom grid and the detail view.

             

            <mx:Canvas id="customerGrid"
            width="100%"
            height="350">
            <customer:CustomerGrid id="customerGrid" />
            </mx:Canvas>

            <customer:CustomerDetail data="{customerGrid.selectedItem}" />

             

            Now, in the above I'm assuming CustomerGrid is actually extending DataGrid, if that is not the case, you'll have to add some additional logic in CustomerGrid. You'll have to set a public property to the value of the selected item of the DataGrid inside CustomerGrid and make it Bindable (see docs: Bindable metadata).

             

            Inside CustomerDetail, bind the TextInput to the data property, defining which property in the data object you want to display.

            Say the selectedItem (in the DataGrid) has a customerName field, you'd do something like this (inside CustomerDetail).

             

            <TextInput text={data.customerName} />