Hi,
I used the pagableArrayCollection as input arraycollection to the datagrid.
Because of this only sorting is not working good. If we change it to
arraycollection its working fine. But i want pagableArraycollection for doing
pagination.
PagableArrayCollection.mxml:(This file i got it from google)
package com.cbeyond.dashboard.utils
{
import mx.collections.ArrayCollection;
import mx.controls.Alert;
public class PagableArrayCollection extends ArrayCollection
{
public function PagableArrayCollection(source:Array=null){
super();
this.source = source;
pages=0;
setFilter();
}
//Private variables
private var _pages:Number;
public var _itemsPerPage:Number = 4;
private var _currentPage:Number = 1;
private var _maxIndex:Number = 24;
private var _minIndex:Number = 0;
//private methods
private function set pages(value:Number):void{
if(this.source.length % this.itemsPerPage == 0){
_pages = this.source.length/this.itemsPerPage;
}
else{
_pages = int(this.source.length/this.itemsPerPage)+1;
}
}
public function setFilter():void{
this._maxIndex = (this.currentPage * this.itemsPerPage)-1;
this._minIndex = this._maxIndex - (this.itemsPerPage -1);
this.filterFunction = filterData;
this.refresh();
}
private function filterData(item:Object):Boolean{
return (this.getItemIndex(item) >= _minIndex &&
this.getItemIndex(item) <= _maxIndex)
}
//public methods
[Bindable]
public function get itemsPerPage():Number{
return _itemsPerPage;
}
public function set itemsPerPage(value:Number):void{
_itemsPerPage = value;
this.pages = 0;
if(this.currentPage > this.pages){
this.currentPage = this.pages;
}
setFilter();
}
[Bindable]
public function get currentPage():Number{
return _currentPage;
}
public function set currentPage(value:Number):void{
_currentPage = value;
setFilter();
}
[Bindable]
public function get pages():Number{
return _pages;
}
public function pageUp():void{
if(this.currentPage < this.pages){
this.currentPage += 1;
}
}
public function pageDown():void{
if(this.currentPage > 1){
this.currentPage -= 1;
}
}
public function enableNextButton():Boolean{
//Alert.show(this.currentPage+","+this.pages);
if(this.currentPage == this.pages)
return false;
else
return true;
}
public function enablePrevButton():Boolean{
if(this.currentPage == 1 || this.currentPage == 0)
return false;
else
return true;
}
}
}
Main.mxml
<?xml version="1.0"?>
initialize="initDP();" width="550" height="400">
<mx:Script>
<![CDATA[
import mx.events.DataGridEvent;
import mx.collections.*;
import com.cbeyond.dashboard.utils.PagableArrayCollection;
// Declare storage variables and initialize the simple variables.
// The data provider collection.
private var myDPColl:PagableArrayCollection; //change this line
when u r trying with ArrayCollection
// The Sort object used to sort the collection.
private var sortA:Sort;
// The sort fields used to determine the sort.
private var sortByInStock:SortField;
private var sortByArtist:SortField;
private var sortByAlbum:SortField;
private var sortByPrice:SortField;
// The data source that populates the collection.
private var myDP:Array = [
{Artist:'Pavement', Album:'Slanted and Enchanted',
Price:11.99, InStock: true},
{Artist:'Pavement', Album:'Crooked Rain, Crooked Rain',
Price:10.99, InStock: false},
{Artist:'Pavement', Album:'Wowee Zowee',
Price:12.99, InStock: true},
{Artist:'Asphalt', Album:'Brighten the Corners',
Price:11.99, InStock: false},
{Artist:'Asphalt', Album:'Terror Twilight',
Price:11.99, InStock: true},
{Artist:'Asphalt', Album:'Buildings Meet the Sky',
Price:14.99, InStock: true},
{Artist:'Other', Album:'Other', Price:5.99, InStock: true}
];
//Initialize the DataGrid control with sorted data.
private function initDP():void {
//Create an ArrayCollection backed by the myDP array of data.
myDPColl = new PagableArrayCollection(myDP); //change this line when
u r trying with ArrayCollection
myGrid.dataProvider=myDPColl;
}
]]>
</mx:Script>
<!-- The Data Grid control.
By default the grid and its columns can be sorted by clicking.
The headerRelease event handler overrides the default sort
behavior. -->
<mx:DataGrid id="myGrid" width="100%" rowCount="7">
<mx:columns>
<mx:DataGridColumn minWidth="120" dataField="Artist" />
<mx:DataGridColumn minWidth="200" dataField="Album" />
<mx:DataGridColumn width="75" dataField="Price" />
<mx:DataGridColumn width="75" dataField="InStock"
headerText="In Stock"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
With this Sorting is not working. Just try it out so that u can understand it
well. If you replace PagableArrayCollection with ArrayCollection Sorting is
working fine. What is that missing in PagableArrayCollection. Or DataGrid wont
support pagableArrayCollection to sort. Please help me guys!!!
----- Forwarded Message ----
From: kotha poornima <[email protected]>
To: flexcoders <[email protected]>
Sent: Friday, March 13, 2009 5:33:00 PM
Subject: [flexcoders] Sorting on Datagrid
Hi All,
I have one datagrid whose values populated from the httpserver response, but
here the problem is when i click on the datagrid header iam getting the rows
sorted but some of the rows are missing. Why is this happening?? Can anyone
faced this issue before. Please suggest me how to solve this issue.
Thanks in Advance,
poornima
