2 Replies Latest reply on Feb 11, 2010 9:17 PM by Sreelash

    Issue with loading external mxml component.

    Sreelash Level 1

      Hi,

       

      I am loading an mxml component named "EmployeeList". its style is follow:


      <?xml version="1.0" encoding="utf-8"?>
      <mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml">
          <mx:Script>
              <![CDATA[
                  import mx.collections.ArrayCollection;
                 
                  [Bindable]
                  public var gridData:ArrayCollection;
              ]]>
          </mx:Script>
          <mx:DataGrid id="employeesGrid"
              dataProvider="{gridData}"
              alternatingItemColors="[#CCCCCC, #AAAAAA]">
             
              <mx:columns>
                  <mx:DataGridColumn dataField="firstName"
                      headerText="First Name"/>
                  <mx:DataGridColumn dataField="lastName"
                      headerText="Last name"/>      
              </mx:columns>
             
          </mx:DataGrid>
      </mx:Panel>

       

      The main file is following:

       

      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
          xmlns:comp = "components.*"
          layout="absolute"
          backgroundGradientAlphas="[1.0, 1.0]"
          horizontalGap="15"
          backgroundGradientColors="[#7424242, #6F6F6F]"
          pageTitle="Company Employee Directory"
          initialize="init()" >
         
          <mx:Script>
              <![CDATA[
                  import valueObjects.Employee;
                  import mx.collections.ArrayCollection;
                  import mx.rpc.events.ResultEvent;
                 
                  [Bindable] private var employeeData:ArrayCollection;
                  [Bindable] private var directReportsData:ArrayCollection;
                 
                  private function resultHandler(event:ResultEvent):void{
                      employeeData = event.target.lastResult.employees.employee;               
                  }
                  private function init():void{
                      employeeService.send();
                      populateDirectReports();
                  }
                  private function populateDirectReports():void{
                      directReportsData = new ArrayCollection();
                      var directReport1:Employee = new Employee();
                          directReport1.firstName = "Christompher";
                          directReport1.lastName = "Lamphber";
                          directReport1.id = "Clamber";
                          directReport1.title = "Director of software engg";
                          directReport1.email = "clampher@test.com";
                          directReport1.managerID = "pdenson";
                          directReport1.department = "Corporate Team";
                          directReport1.location = "San Fransisco";
                          directReport1.phone = "123-456-7890";
                          directReport1.directDial = "34101";
                          directReport1.deskLocation = "45-3";
                          directReport1.city = "San Fransisco";
                          directReport1.state = "California";
                          directReport1.countryCode = "US";
                          directReport1.postalCode = 94103;
                      var directReport2:Employee = new Employee();
                          directReport2.firstName = "Dean";
                          directReport2.lastName = "Mownson";
                          directReport2.id = "dhownson";
                          directReport2.title = "Director of software engg";
                          directReport2.email = "dhownson@test.com";
                          directReport2.managerID = "pdenson";
                          directReport2.department = "Corporate Team";
                          directReport2.location = "San Fransisco";
                          directReport2.phone = "893-426-5470";
                          directReport2.directDial = "34441";
                          directReport2.deskLocation = "45-4";
                          directReport2.city = "San Fransisco";
                          directReport2.state = "California";
                          directReport2.countryCode = "US";
                          directReport2.postalCode = 94103;
                      directReportsData.addItem(directReport1);
                      directReportsData.addItem(directReport2);       
                  }
              ]]>
          </mx:Script>
         
          <mx:HTTPService id="employeeService"
              url="data/employees.xml"
              result="resultHandler(event)"/> 
          <mx:VBox verticalGap="15">   
              <mx:HBox verticalAlign="middle" >
                  <mx:Label text="EMPLOYEE"
                            fontSize="15" fontWeight="bold" fontFamily="Arial" color="#FFFFFF"/>
                  <mx:Label text="DIRECTORY"
                            fontSize="15" fontWeight="bold" fontFamily="Arial" color="#DA180F"/>                   
              </mx:HBox>     
             
              <comp:search id="searchEmployees"/>
                     
              <mx:HBox horizontalGap="15">   
                  <comp:EmployeeList id="allEmployeesList"
                        title="Company Employees"
                        gridData="{employeeData}" />    
                  <comp:employeeDetails id="employeeDetails"/>
                  <comp:EmployeeList id="directReportsList"
                        title="Direct Reports"
                        gridData="{directReportsData}"/>         
              </mx:HBox>
          </mx:VBox>
      </mx:Application>

       

      Now the xml is not loading in to the datagrid.

       

      In the mxml component "EmployeeList", a variable named gridData is binded with dataprovider. In the main file, a variable named employeeData is used as bindable, in which xml is loaded. When the EmployeeList component is invoked in the mail file, the gridData is binded as follows:


      <comp:EmployeeList id="allEmployeesList"
                        title="Company Employees"
                        gridData="{employeeData}" />   

       

      Can anybody help me to solve this issue.

       

       

      thanks and regards,

      Sreelash