7 Replies Latest reply on Jun 27, 2011 8:12 AM by fingersmagoo

    List Selected Index not correct

    fingersmagoo

      Hello

       

      I have a List with a custom ItemRenderer.  When I fire the lstMessages_changeHandler(event:IndexChangeEvent):void event the selectedItem is always teh first one in the list.  Once it is fired, it will not fire again.  It seems like a simple thing to get the selected item...but I am at a loss.

       

      Thank you in advance,

       

      Paul

       

      ////View Code

       

      <?xml version="1.0" encoding="utf-8"?>

      <s:View xmlns:fx="http://ns.adobe.com/mxml/2009"

      xmlns:s="library://ns.adobe.com/flex/spark" title="The Wall" creationComplete="init()">

      <fx:Declarations>

      <!-- Place non-visual elements (e.g., services, value objects) here -->

      </fx:Declarations>

       

      <fx:Script>

      <![CDATA[

      import com.facebook.graph.Facebook;

      import com.facebook.graph.FacebookMobile;

      import com.trinet.bl.BusinessLogic;

       

      import mx.binding.utils.BindingUtils;

      import mx.collections.*;

      import mx.managers.CursorManager;

       

      import spark.events.IndexChangeEvent;

      import mx.events.FlexEvent;

       

      import mx.events.ItemClickEvent;

       

       

       

      private static var bl:BusinessLogic = BusinessLogic.getInstance();

      [Bindable]

      public var messages:ArrayCollection;

       

      protected function init():void

      {

      bl.wallView=this;

      bl.getWallPosts();

      }

       

      protected function btnAdd_clickHandler(event:MouseEvent):void

      {

      CursorManager.setBusyCursor();

      bl.addWallPost();

      CursorManager.removeBusyCursor();

      }

       

      protected function lstMessages_changeHandler(event:IndexChangeEvent):void

      {

      //var action:Object = lstMessages.selectedItem;

      //navigator.pushView(WallPostDetail, lstMessages.getChildAt(event.newIndex));

      trace (event.newIndex);

      }

       

      ]]>

      </fx:Script>

       

      <s:Label id="lblMessage" left="10" right="10" top="10" text="Enter Message"/>

      <s:Button id="btnAdd" right="12" top="39" label="Add" click="btnAdd_clickHandler(event)"/>

      <s:TextArea id="txtMessage" left="10" right="96" top="34"/>

      <s:List id="lstMessages" left="10" right="10" top="116" bottom="6"

      change="lstMessages_changeHandler(event)" dataProvider="{messages}" fontSize="20"

      itemRenderer="renderer.WallItemRenderer" labelField="message"></s:List>

      </s:View>

       

       

      ////ItemRenderer Code

      <?xml version="1.0" encoding="utf-8"?>

      <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"

      xmlns:s="library://ns.adobe.com/flex/spark">

      <fx:Script>

      <![CDATA[

      import mx.events.ItemClickEvent;

      import com.trinet.bl.BusinessLogic;

      import mx.core.FlexGlobals;

      import spark.components.List;

       

      [Bindable]

      public var myBGColor:int = 0xFFFFFF;

      private var mydata:Object;

       

      override public function set itemIndex(value:int):void

      {

      if ((value%2) == 0)

      {

      myBGColor= 0xFFFFFF;

      }

      if ((value%2) == 1)

      {

      myBGColor= 0xCCFF66;

      }

      }

      override public function set data(value:Object):void

      {

      mydata=value;

      lblMessage.text = value.message;

      var comments:Array = value.comments.comment_list;

      lblComments.text=lblComments.text+value.comments.count;

      lblLikes.text=lblLikes.text+value.likes.count;

      }

       

      ]]>

      </fx:Script>

      <s:Rect id="myRect" left="0" right="0" top="0" bottom="0" alpha="1.0">

      <s:stroke>

      <s:SolidColorStroke color="0xA8C6EE" weight="1"/>

      </s:stroke>

      <s:fill>

      <s:SolidColor color="{myBGColor}"/>

      </s:fill>

      </s:Rect>  

      <s:Label id="lblMessage" left="5" top="5" bottom="21" width="458" fontSize="15" text="Label"

      textAlign="left" verticalAlign="top"/>

      <s:Label id="lblComments" left="10" bottom="1" height="12" fontSize="12" text="Comments: "/>

      <s:Label id="lblLikes" left="111" bottom="1" fontSize="12" text="Likes: "/>

       

      </s:ItemRenderer>

        • 1. Re: List Selected Index not correct
          Shongrunden Adobe Employee

          I can't compile this example, can you please post a complete, compilable sample application so I can investigate further?

          • 2. Re: List Selected Index not correct
            fingersmagoo Level 1

            Hello,

             

            Is there a way to send you the app via zip file?

             

            Paul

            • 3. Re: List Selected Index not correct
              fingersmagoo Level 1

              OK, I slimmed it down.  It does not register the correct selected index and it will not allow you to click more than once.

               

              ListDebugHomeView

               

              <?xml version="1.0" encoding="utf-8"?>

              <s:View xmlns:fx="http://ns.adobe.com/mxml/2009"

              xmlns:s="library://ns.adobe.com/flex/spark" title="HomeView" creationComplete="init()">

              <fx:Script>

              <![CDATA[

              import mx.binding.utils.BindingUtils;

              import mx.collections.*;

              import mx.events.FlexEvent;

              import mx.events.ItemClickEvent;

               

              import spark.events.IndexChangeEvent;

               

              [Bindable]

              public var messages:ArrayCollection;

               

               

              protected function lstPosts_changeHandler(event:IndexChangeEvent):void

              {

               

              trace (event.newIndex);

               

              }

              protected function init():void

              {

              messages = new ArrayCollection();

              messages.addItem("test1");

              messages.addItem("test2");

              messages.addItem("test3");

              messages.addItem("test4");

              messages.addItem("test5");

              messages.addItem("test6");

              messages.addItem("test7");

              messages.addItem("test8");

              messages.addItem("test9");

              messages.addItem("test10");

              }

               

              ]]>

              </fx:Script>

              <fx:Declarations>

              <!-- Place non-visual elements (e.g., services, value objects) here -->

              </fx:Declarations>

              <s:List id="lstPosts" left="10" right="10" top="10" bottom="10"

              change="lstPosts_changeHandler(event)"

              dataProvider="{messages}" itemRenderer="views.WallItemRenderer"></s:List>

              </s:View>

              WallItemRenderer
              <?xml version="1.0" encoding="utf-8"?>
              <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
              xmlns:s="library://ns.adobe.com/flex/spark">
              <fx:Script>
              <![CDATA[
              import mx.events.ItemClickEvent;
              import mx.core.FlexGlobals;
              import spark.components.List;
              [Bindable]
              public var myBGColor:int = 0xFFFFFF;
              override public function set itemIndex(value:int):void
              {
              if ((value%2) == 0)
              {
              myBGColor= 0xFFFFFF;
              }
              if ((value%2) == 1)
              {
              myBGColor= 0xCCFF66;
              }
              }
              override public function set data(value:Object):void
              {
              lblMessage.text = value.toString();
              }
              ]]>
              </fx:Script>
              <s:Rect id="myRect" left="0" right="0" top="0" bottom="0" alpha="1.0">
              <s:stroke>
              <s:SolidColorStroke color="0xA8C6EE" weight="1"/>
              </s:stroke>
              <s:fill>
              <s:SolidColor color="{myBGColor}"/>
              </s:fill>
              </s:Rect>  
              <s:Label id="lblMessage" left="5" top="5" bottom="21" width="458" fontSize="15" text="Label"
              textAlign="left" verticalAlign="top"/>
              <s:Label id="lblComments" left="10" bottom="1" height="12" fontSize="12" text="Comments: "/>
              <s:Label id="lblLikes" left="111" bottom="1" fontSize="12" text="Likes: "/>
              </s:ItemRenderer>

              • 4. Re: List Selected Index not correct
                rstanvir

                change="lstMessages_changeHandler(event)"

                this event will be fired only when there is a change in the selected index of the list.

                 

                perhaps your message collection (which is the data provider of the list) has length 1.

                1 person found this helpful
                • 5. Re: List Selected Index not correct
                  rstanvir Level 1

                  in itemrenderer also override the get method of itemIndex and data.

                  hope this will resolve the problem.

                  • 6. Re: List Selected Index not correct
                    fingersmagoo Level 1

                    Cool, I added a var for index and set it during the set data function.  Then just retyurned in it in the override public function get itemIndex():int.

                     

                    Works great now.  Did not know this needed to be done.

                     

                    Paul

                    • 7. Re: List Selected Index not correct
                      rstanvir Level 1

                      when u override something it becomes ur foremost duty to handle every side of it.

                       

                      u were overriding the set method so the base class had no chance to store the itemIndex;

                      again u were not overriding the get method, this time the base class had to handle the get method but alas!! from where it would get the value cz u already robbed the set method from it.