Mxml Components

[Anitha]

Hi all,

I have tried using separate components for separate parts of my
project but it has some problem accessing data from one component to
other. As a result i have 2 write the code in a single large
monolithic file(main application file).But it is confusing and bad way
of writing code.So pls can anyone help me out with the use of
components......


thanks in anticipation

Anitha

[drkstr]

Generally the easiest way to get components to communicate is to dispatch an event that the parent listens to and acts on accordingly. Just look how the mx components interact with each other as an example. For instance, what if you wanted a Label to show the selectedLabel of a ComboBox? You wouldn't need to rewrite the entire code for the Label and the ComboBox in the same file would you?

Give it a try, and post any specific problems you run into on this forum. I'm sure someone will be more then willing to help you with it.

Best Regards,
~Aaron

[Anitha]

Hi Aaron.Thanks for your reply.hereby i created my first component bt there is some problem though i met the partial result.I also posted the problem with my script in my yesterday post [named: custom component prob].if u have any idea please pass me?.

Regards
Anitha.

[kahuja]

I looked at your code in the other post http://www.actionscript.org/forums/showthread.php3?t=167794 and you have used events correctly. What is the issue you are facing?

[Anitha]

Hi kahuja,
Thanks for you reply.here my problem is , when i click the firstgrid's cellcontent , the answer displays wrongly in second grid [ie.here iam using the salesforce data,First grid populates the whole datails in yearwise,when click a year it shows all regionwisesales details of the particular year].When i click the year 2000,it shows 2001's result.[ie] when i click a year it shows next year's data in the second grid.why?how can i get a correct answer????

[kahuja]

This seems to be an issue with indexes - check if the indexss being trapped are correctly handled.

Also, the code you have provided can not be compiled and run as is, for me to debug the problem, if can upload a compilable code would be good.

[Anitha]

kahuja,

Thanks for your reply.here with i sent my code for yur ref.Here am using the eventlistener toaccess the dispatch event.


Main.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*" layout="absolute" width="100%" height="100%">
<local:secondcomponent id="second" right="5" top="0" width="49%" height="50%"/>
<local:firstcomponent id="first" left="5" top="0" width="49%" height="50%"
yearChange="display()"/>
<mx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
import mx.collections.ArrayCollection;
import mx.utils.ArrayUtil;

public function display():void{
first.addEventListener("yearChange", firstlistener);
}


public var secondgridanswer:ArrayCollection=new ArrayCollection;
public function firstlistener(event:ResultEvent):void{
secondgridanswer=(event.result.Tables["divisionshow"].Rows);
var ans1:Array=ArrayUtil.toArray(secondgridanswer);
second.secondcomponentgrid.dataProvider=secondgrid answer;
}

]]>
</mx:Script>
</mx:Application>


Firstcomponent.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Metadata>
[Event(name="yearChange",type="mx.rpc.events.ResultEvent")]
</mx:Metadata>
<mx:DataGrid width="100%" height="100%" id="firstcomponentgrid"
dataProvider="{answer}" change="send()">
<mx:columns>
<mx:DataGridColumn headerText="Year" dataField="year"/>
<mx:DataGridColumn headerText="Projected"
dataField="projected"/>
<mx:DataGridColumn headerText="Achieved"
dataField="achieved"/>
</mx:columns>
</mx:DataGrid>

<mx:WebService id="myService" wsdl="http://localhost/Service.asmx?wsdl"
showBusyCursor="true"
fault="mx.controls.Alert.showevent.fault.faultString);">
<mx:operation name="getPeriod" resultFormat="object"
result="remotingHandler(event)"
fault="mx.controls.Alert.show(event.fault.faultString);"/>
<mx:operation name="getDivision" resultFormat="object"
result="dispatchEvent(new ResultEvent('yearChange'));"
fault="mx.controls.Alert.show(event.fault.faultString);">
<mx:request xmlns="">
<year>{firstcomponentgrid.selectedItem.year}</year>
</mx:request>
</mx:operation>
</mx:WebService>
<mx:Script>
<![CDATA[
[Bindable]
public var answer:ArrayCollection=new ArrayCollection;
public function remotingHandler(event:ResultEvent):void{
answer=(event.result.Tables["annualresult"].Rows);
var ans1:Array=ArrayUtil.toArray(answer);
}

public function send():void{
myService.getDivision.send();
}

]]>
</mx:Script>
</mx:Panel>


SecondComponent:
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:DataGrid width="100%" height="100%" id="secondcomponentgrid">
<mx:columns>
<mx:DataGridColumn headerText="Year" dataField="year"/>
<mx:DataGridColumn headerText="Division"
dataField="divison"/>
<mx:DataGridColumn headerText="Projected"
dataField="projected"/>
<mx:DataGridColumn headerText="Achieved"
dataField="achieved"/>
</mx:columns>
</mx:DataGrid>
</mx:Panel>


ERROR REPORT:
[[Cannot access a property or method of a null object reference.at
main/firstlistener()[-------\----\main.mxml:36].


Here is my xml result:
for firstcomponent grid:
* <?xml version="1.0" encoding="utf-8" ?>
- <DataTable xmlns="http://tempuri.org/">
- <xs:schema id="NewDataSet" xmlns="" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
- <xs:element name="NewDataSet" msdata:IsDataSet="true" msdata:MainDataTable="annualresult" msdata:UseCurrentLocale="true">
- <xs:complexType>
- <xs:choice minOccurs="0" maxOccurs="unbounded">
- <xs:element name="annualresult">
- <xs:complexType>
- <xs:sequence>
* <xs:element name="year" type="xs:decimal" minOccurs="0" />
* <xs:element name="projected" type="xs:decimal" minOccurs="0" />
* <xs:element name="achieved" type="xs:decimal" minOccurs="0" />
* </xs:sequence>
* </xs:complexType>
* </xs:element>
* </xs:choice>
* </xs:complexType>
* </xs:element>
* </xs:schema>
- <diffgr:diffgram xmlns:msdata="urn:schemas-microsoft-com:xml-msdata" xmlns:diffgr="urn:schemas-microsoft-com:xml-diffgram-v1">
- <DocumentElement xmlns="">
- <annualresult diffgr:id="annualresult1" msdata:rowOrder="0">
* <year>2000</year>
* <projected>2300000</projected>
* <achieved>1961000</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult2" msdata:rowOrder="1">
* <year>2001</year>
* <projected>3100000</projected>
* <achieved>2211000</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult3" msdata:rowOrder="2">
* <year>2002</year>
* <projected>3100000</projected>
* <achieved>2211000</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult4" msdata:rowOrder="3">
* <year>2003</year>
* <projected>2630250</projected>
* <achieved>2462500</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult5" msdata:rowOrder="4">
* <year>2004</year>
* <projected>2600000</projected>
* <achieved>2400500</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult6" msdata:rowOrder="5">
* <year>2005</year>
* <projected>2450000</projected>
* <achieved>2400500</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult7" msdata:rowOrder="6">
* <year>2006</year>
* <projected>2050000</projected>
* <achieved>2200500</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult8" msdata:rowOrder="7">
* <year>2007</year>
* <projected>258000</projected>
* <achieved>258000</achieved>
* </annualresult>
- <annualresult diffgr:id="annualresult9" msdata:rowOrder="8">
* <year>2008</year>
* <projected>758000</projected>
* <achieved>658000</achieved>
* </annualresult>
* </DocumentElement>
* </diffgr:diffgram>
* </DataTable>


[U]//second component grid result[/U[B]][if i click the year 2001 in the firstcomponentgrid*
<?xml version="1.0" encoding="utf-8" ?>
- <DataTable xmlns="http://tempuri.org/">
- <xs:schema id="NewDataSet" xmlns="" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
- <xs:element name="NewDataSet" msdata:IsDataSet="true" msdata:MainDataTable="divisionshow" msdata:UseCurrentLocale="true">
- <xs:complexType>
- <xs:choice minOccurs="0" maxOccurs="unbounded">
- <xs:element name="divisionshow">
- <xs:complexType>
- <xs:sequence>
* <xs:element name="year" type="xs:decimal" minOccurs="0" />
* <xs:element name="division" type="xs:string" minOccurs="0" />
* <xs:element name="projected" type="xs:decimal" minOccurs="0" />
* <xs:element name="achieved" type="xs:decimal" minOccurs="0" />
* </xs:sequence>
* </xs:complexType>
* </xs:element>
* </xs:choice>
* </xs:complexType>
* </xs:element>
* </xs:schema>
- <diffgr:diffgram xmlns:msdata="urn:schemas-microsoft-com:xml-msdata" xmlns:diffgr="urn:schemas-microsoft-com:xml-diffgram-v1">
- <DocumentElement xmlns="">
- <divisionshow diffgr:id="divisionshow1" msdata:rowOrder="0">
* <year>2001</year>
* <division>AAAAA</division>
* <projected>825000</projected>
* <achieved>700000</achieved>
* </divisionshow>
- <divisionshow diffgr:id="divisionshow2" msdata:rowOrder="1">
* <year>2001</year>
* <division>BBBBB</division>
* <projected>925000</projected>
* <achieved>850000</achieved>
* </divisionshow>
- <divisionshow diffgr:id="divisionshow3" msdata:rowOrder="2">
* <year>2001</year>
* <division>CCCCC</division>
* <projected>725000</projected>
* <achieved>256000</achieved>
* </divisionshow>
- <divisionshow diffgr:id="divisionshow4" msdata:rowOrder="3">
* <year>2001</year>
* <division>DDDDD</division>
* <projected>625000</projected>
* <achieved>405000</achieved>
* </divisionshow>
* </DocumentElement>
* </diffgr:diffgram>
* </DataTable>

[Anitha]

In my last application when i debug the application, I find out the firstlistener method event object in main.mxml cannot access why?Is there any problem in event dispatching method.I refer with the flex3 docs and 3.0 sdk also but i cant findout the error.
any idea please??

[kahuja]

Hi Anitha,

I am stuck with a few things, and will not be able to spend any time on this for next few days.