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

    dataGrid with itemEditor with DropDownList error

    Michelle5002 Community Member

      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 Community Member

          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 Community Member

            See my second post to this question