Datagrid pagining with count

I am trying to get my datagrid paging to work 100%:

The paging part is working, but I need the display of items: "Viewing Laerts 1-25 of 500" to display right.
I need to be able to click "view All' and all records return in the data grid and scroll.

CODE:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                        layout="absolute"
                        creationComplete="InitApp()">

<mx:VBox width="600" height="400"
             paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10" verticalScrollPolicy="off" horizontalScrollPolicy="off">

      <mx:Script>
            <![CDATA[
                  import mx.collections.ArrayCollection;
                  import mx.events.ItemClickEvent;
                  import mx.controls.Button;
                  import mx.controls.Alert;
                  
                  [Bindable]
                  public var myData:ArrayCollection = new ArrayCollection();
                  
                  public var orgData:ArrayCollection = new ArrayCollection();
                  
                  [Bindable]
                  public var nav:ArrayCollection = new ArrayCollection();
                  
                  /* Records per page */
                  public var pageSize:uint = 25;
                  /* Number of pages per view */
                  public var navSize:uint = 10;
                  private var index:uint = 0;
                  private var navPage:uint = 1;
                  
                  /* Test data */
                  private function InitApp():void
                  {
                        for( var x:uint = 1; x <= 500; x++ )
                        {
                              var obj:Object = new Object();
                              obj.Icon = x.toString(); /* Needs to be an icon image */
                              obj.Status = "Pending";
                              obj.DateTime = "11/" + x.toString() + "/2008";
                              obj.Artifact = "Artifact " + x.toString();
                              obj.Owner = "Mark Johnson";
                              obj.MarkedBy = "Rick Gerald";
                              obj.Reason = "Illegal Content"; /* Requires Tool Tip */
                              
                              orgData.addItem(obj);
                        }
                        refreshDataProvider(index);
                        createNavBar(Math.ceil(orgData.length/pageSize));
                  }
                  
                  /* Create pagination */
                  private function createNavBar(pages:uint = 1,set:uint = 0):void
                  {
                        nav.removeAll();
                        if( pages > 1 )
                        {
                              nav.addItem({label:"< Previous",data:0});
                        }
                              
                              for( var x:uint = 0; x < navSize; x++)
                              {
                                    var pg:uint = x + set;
                                    nav.addItem({label: pg + 1,data: pg});
                              }
                              if( pg < pages - 1 )
                              {
                                    nav.addItem({label:"Next >",data:pg + 1});
                              }
                        }
                  
                  /* Refresh data per page groups */
                  private function navigatePage(event:ItemClickEvent):void
                  {
                        refreshDataProvider(event.item.data);
                        var lb:String = event.item.label.toString();
                        if( lb.indexOf("<") > -1 || lb.indexOf(">") > -1 )
                        {
                              createNavBar(Math.ceil(orgData.length/pageSize),event.item.data);
                        }
                        
                  }
                  
                  private function refreshDataProvider(start:uint):void
                  {
                        myData = new ArrayCollection( orgData.source.slice((start * pageSize),(start * pageSize) + pageSize) );
                  }
                  
                  /* public static function getDefaultImage(group:String, type:String):Object{
                        var stuff:Array = StyleManager.selectors;
                        var css:CSSStyleDeclaration = StyleManager.getStyleDeclaration("." + getIconStyleName(group) + type);
                        if (css == null)
                              css = StyleManager.getStyleDeclaration(".informationIcon" + type);
                        var img:Object = css.getStyle("borderSkin");
                        return img;
                  } */
                  
                  /* Viewing pages */
                  [Bindable]
                  public var startAlert:uint;
                  [Bindable]
                  public var endAlert:uint;
                  [Bindable]
                  public var totalAlert:uint;
                  
                  private function viewingAlerts ():void {
                        startAlert == ((navPage - 1) * pageSize + 1);
                        endAlert == ((navPage - 1) * pageSize + pageSize);
                        totalAlert == myData.length;
                  }
                  
                  /* private function handleDeptChange():void
            {
                myData.filterFunction = filterStatus;
                myData.refresh();
            }
           
            private function filterStatus(item:Object):String {

            } */
            ]]>
      </mx:Script>

      <mx:Label text="Content Alerts"/>
      <mx:HBox width="100%">
            <mx:Label id="veiwingAlertsLabel" text="Viewing Alerts {startAlert}-{endAlert} of {totalAlert}"/>
            <!--
            <mx:Spacer width="40%"/>
            <mx:Label id="filterByLabel" text="Filter by:"/>
            <mx:LinkButton label="Unprocessed"/>
            <mx:VRule height="20"/>
            <mx:LinkButton label="Processed"/>
            <mx:VRule height="20"/>
            <mx:LinkButton label="All"/>
            -->
      </mx:HBox>
      <mx:DataGrid id="contentAlertDataGrid" dataProvider="{myData}" width="100%" height="100%" verticalScrollPolicy="on" horizontalScrollPolicy="off"/>
      <mx:HRule width="100%"/>
      <mx:HBox width="100%">
            <mx:LinkButton id="viewAllLinkBtn" label="View All"/>
            <mx:VRule height="20"/>
            <mx:LinkBar id="pageNav" itemClick="navigatePage(event)" dataProvider="{nav}" width="{contentAlertDataGrid.width}"/>
      </mx:HBox>
</mx:VBox>
</mx:Application>

DIGITALUnderworldAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

evcrCommented:
probably not entirely what you are after but a good starter...
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                        layout="absolute"
                        creationComplete="InitApp()">
 
<mx:VBox width="600" height="400"
             paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10" verticalScrollPolicy="off" horizontalScrollPolicy="off">
 
      <mx:Script>
            <![CDATA[
                  import mx.collections.ArrayCollection;
                  import mx.events.ItemClickEvent;
                  import mx.controls.Button;
                  import mx.controls.Alert;
                  
                  [Bindable]
                  public var myData:ArrayCollection = new ArrayCollection();
                  
                  public var orgData:ArrayCollection = new ArrayCollection();
                  
                  [Bindable]
                  public var nav:ArrayCollection = new ArrayCollection();
                  
                  /* Records per page */
                  public var pageSize:uint = 25;
                  /* Number of pages per view */
                  public var navSize:uint = 10;
                  private var index:uint = 0;
                  private var navPage:uint = 1;
                  
                  /* Test data */
                  private function InitApp():void
                  {
                        for( var x:uint = 1; x <= 500; x++ )
                        {
                              var obj:Object = new Object();
                              obj.Icon = x.toString(); /* Needs to be an icon image */
                              obj.Status = "Pending";
                              obj.DateTime = "11/" + x.toString() + "/2008";
                              obj.Artifact = "Artifact " + x.toString();
                              obj.Owner = "Mark Johnson";
                              obj.MarkedBy = "Rick Gerald";
                              obj.Reason = "Illegal Content"; /* Requires Tool Tip */
                              
                              orgData.addItem(obj);
                        }
                        refreshDataProvider(index);
                        createNavBar(Math.ceil(orgData.length/pageSize));
                  }
                  
                  /* Create pagination */
                  private function createNavBar(pages:uint = 1,set:uint = 0):void
                  {
                        nav.removeAll();
                        if( pages > 1 )
                        {
                              nav.addItem({label:"< Previous",data:0});
                        }
                              
                              for( var x:uint = 0; x < navSize; x++)
                              {
                                    var pg:uint = x + set;
                                    nav.addItem({label: pg + 1,data: pg});
                              }
                              if( pg < pages - 1 )
                              {
                                    nav.addItem({label:"Next >",data:pg + 1});
                              }
                        }
                  
                  /* Refresh data per page groups */
                  private function navigatePage(event:ItemClickEvent):void
                  {
                        refreshDataProvider(event.item.data);
                        var lb:String = event.item.label.toString();
                        if( lb.indexOf("<") > -1 || lb.indexOf(">") > -1 )
                        {
                              createNavBar(Math.ceil(orgData.length/pageSize),event.item.data);
                        }
                        
                  }
                  
                  private function refreshDataProvider(start:uint):void
                  {
                        myData = new ArrayCollection( orgData.source.slice((start * pageSize),(start * pageSize) + pageSize) );
                  viewingAlertsLabel.text = (start * pageSize).toString() + ' ' + pageSize.toString() + ' ' + orgData.length.toString();
                  }
                  
                  /* public static function getDefaultImage(group:String, type:String):Object{
                        var stuff:Array = StyleManager.selectors;
                        var css:CSSStyleDeclaration = StyleManager.getStyleDeclaration("." + getIconStyleName(group) + type);
                        if (css == null)
                              css = StyleManager.getStyleDeclaration(".informationIcon" + type);
                        var img:Object = css.getStyle("borderSkin");
                        return img;
                  } */
                  
                  /* Viewing pages */
                  [Bindable]
                  public var startAlert:uint;
                  [Bindable]
                  public var endAlert:uint;
                  [Bindable]
                  public var totalAlert:uint;
                  
                  private function viewingAlerts ():void {
                        startAlert == ((navPage - 1) * pageSize + 1);
                        endAlert == ((navPage - 1) * pageSize + pageSize);
                        totalAlert == myData.length;
                  }
                  
                  /* private function handleDeptChange():void
            {
                myData.filterFunction = filterStatus;
                myData.refresh();
            }
           
            private function filterStatus(item:Object):String {
 
            } */
            ]]>
      </mx:Script>
 
      <mx:Label text="Content Alerts"/>
      <mx:HBox width="100%">
            <mx:Label id="viewingAlertsLabel" text="stuff"/>
            <!--
            <mx:Spacer width="40%"/>
            <mx:Label id="filterByLabel" text="Filter by:"/>
            <mx:LinkButton label="Unprocessed"/>
            <mx:VRule height="20"/>
            <mx:LinkButton label="Processed"/>
            <mx:VRule height="20"/>
            <mx:LinkButton label="All"/>
            -->
      </mx:HBox>
      <mx:DataGrid id="contentAlertDataGrid" dataProvider="{myData}" width="100%" height="100%" verticalScrollPolicy="on" horizontalScrollPolicy="off"/>
      <mx:HRule width="100%"/>
      <mx:HBox width="100%">
            <mx:LinkButton id="viewAllLinkBtn" label="View All" click="contentAlertDataGrid.dataProvider = orgData;"/>
            <mx:VRule height="20"/>
            <mx:LinkBar id="pageNav" itemClick="navigatePage(event)" dataProvider="{nav}" width="{contentAlertDataGrid.width}"/>
      </mx:HBox>
</mx:VBox>
</mx:Application>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Apache Flex

From novice to tech pro — start learning today.