2 Replies Latest reply on May 4, 2011 3:00 PM by Michelle5002

    dataGrid with itemEditor with DropDownList error

    Michelle5002 Level 1

      I keep getting this error   TypeError: Error #1034: Type Coercion failed: cannot convert  views::EmployeesNonAvailsInnerClass2@3717c29 to  mx.controls.listClasses.IListItemRenderer.  When I select the column  which the dropdownList is suppose to display.  I am using a custom  component which I included the code below.  I am new to Flex and so what  I have so far came out of the book Flex 4 Bible.  My data is coming  from a webservice and returns an array of class ReasonDto and I am  saving the results to a s:ArrayCollection.  I sorta had it working  before the custom dropdownlist when I used mx controls but I keep  getting this when I use s controls.  Any suggestions?

       

      package components
      {
        import mx.events.FlexEvent;
       
        import spark.components.DropDownList;
       
        public class SelectableDropDown extends DropDownList
        {
          public var selectField:String = "";
          public var selectFieldValue:* = null;
         
          public function SelectableDropDown()
          {
            super();
            this.addEventListener(FlexEvent.CREATION_COMPLETE, creationCompleteHandler);
          }
          private function creationCompleteHandler(event:FlexEvent):void
          {
            updateSelection();
          }
          public function updateSelection():void
          {
            if (selectField != "" && selectFieldValue != null && dataProvider != null)
            {
              var dataObj:Object;
              for (var i:Number=0; i<dataProvider.length; i++)
              {
                dataObj = dataProvider.getItemAt(i);
                if (dataObj[selectField] == selectFieldValue)
                {
                  selectedIndex = i;
                  break;
                }
              }
            }
          }
        }
      }

       

      Here is the code which calls the component

       

                  <mx:DataGridColumn headerText="Reason" width="100" dataField="reason.reason" editable="true"
                                     editorDataField="selectedItem">
                      <mx:itemEditor>
                          <fx:Component>
                              <components:SelectableDropDown prompt="Select a Reason"
                                               dataProvider="{parentDocument.reasonsDP}"
                                               labelField="reason.reason"
                                               selectField="reason"
                                               selectFieldValue="reason.reason"/>
                          </fx:Component>
                      </mx:itemEditor>
                  </mx:DataGridColumn>

        • 1. Re: dataGrid with itemEditor with DropDownList error
          Michelle5002 Level 1

          The answer was to just add the canvas and that solved it. Still having issues but this is the solution to this problem

           

          Here is my current code now

           

                      <mx:DataGridColumn headerText="Reason" width="100" dataField="reason.reason" editable="true"
                                         editorDataField="selectedItem">
                          <mx:itemEditor>
                              <fx:Component>
                                  <mx:Canvas>
                                      <fx:Script>
                                          <![CDATA[
                                              import mx.collections.ArrayCollection;
                                              import mx.rpc.events.ResultEvent;
                                              import mx.events.FlexEvent;
                                              import mx.controls.Alert;
                                             
                                              [Bindable]
                                              public var reasonsDP:ArrayCollection;
                                             
                                              protected function sdd_creationCompleteHandler(event:FlexEvent):void
                                              {
                                                  getReasonsResult.token = personnelBean.getReasons();
                                              }
                                             
                                              public function get selectedItem():ReasonDto
                                              {
                                                  return selectableDropDown.selectedItem;
                                              }
                                             
                                              public function get prompt():ReasonDto
                                              {
                                                  return selectableDropDown.selectedItem.reason;
                                              }
                                             
          <!--                                    public override function setFocus():void
                                              {
                                                  selectableDropDown.setFocus();
                                              }
          -->                                   
                                              protected function getReasonsResult_resultHandler(event:ResultEvent):void
                                              {
                                                  reasonsDP = getReasonsResult.lastResult;
                                              }
                                             
                                          ]]>
                                      </fx:Script>
                                      <fx:Declarations>
                                          <personnelbean:PersonnelBean id="personnelBean" fault="Alert.show(event.fault.faultString + '\n' + event.fault.faultDetail)" showBusyCursor="true"/>
                                          <s:CallResponder id="getReasonsResult" result="getReasonsResult_resultHandler(event)"/>
                                          <valueObjects:ReasonDto id="reasonDto"/>
                                          <!-- Place non-visual elements (e.g., services, value objects) here -->
                                      </fx:Declarations>
                                      <components:SelectableDropDown id="selectableDropDown"
                                                       dataProvider="{reasonsDP}"
                                                       labelField="reason"
                                                       selectField="reason"
                                                       selectFieldValue="reason"
                                                       creationComplete="sdd_creationCompleteHandler(event)"/>
                                  </mx:Canvas>
                              </fx:Component>
                          </mx:itemEditor>
                      </mx:DataGridColumn>

          • 2. Re: dataGrid with itemEditor with DropDownList error
            Michelle5002 Level 1

            See my second post to this question