Print Friendly

# Class Ext.PagingToolbar

Package: | Ext
Class: | PagingToolbar
Extends: | Toolbar
Defined In: | PagingToolbar.js

A specialized toolbar that is bound to a Ext.data.Store and provides automatic paging controls.
Properties - Methods - Events - Config Options

## Public Properties

Property | Defined By
--- | ---
| afterPageText : String | PagingToolbar
Customizable piece of the default paging text (defaults to "of %0")
| beforePageText : String | PagingToolbar
Customizable piece of the default paging text (defaults to "Page")
| firstText : String | PagingToolbar
Customizable piece of the default paging text (defaults to "First Page")
| lastText : String | PagingToolbar
Customizable piece of the default paging text (defaults to "Last Page")
| nextText : String | PagingToolbar
Customizable piece of the default paging text (defaults to "Next Page")
| prevText : String | PagingToolbar
Customizable piece of the default paging text (defaults to "Previous Page")
| refreshText : String | PagingToolbar
Customizable piece of the default paging text (defaults to "Refresh")

## Public Methods

Method | Defined By
--- | ---
| PagingToolbar(`String/HTMLElement/Element container`, `Ext.data.Store store`, `Object config`) | PagingToolbar
Create a new PagingToolbar
| add(`Mixed arg1`, `Mixed arg2`, `Mixed etc`) : void | Toolbar
Adds element(s) to the toolbar - this function takes a variable number of arguments of mixed type and adds them to t...
| addButton(`Object/Array config`) : Ext.Toolbar.Button/Array | Toolbar
Add a button (or buttons), see Ext.Toolbar.Button for more info on the config
| addDom(`Object config`) : Ext.Toolbar.Item | Toolbar
Adds a new element to the toolbar from the passed DomHelper config
| addElement(`String/HTMLElement/Element el`) : Ext.Toolbar.Item | Toolbar
Adds any standard HTML element to the toolbar
| addField(`Field field`) : ToolbarItem | Toolbar
Add a dynamically rendered Ext.form field (TextField, ComboBox, etc). Note: the field should not have been rendered y...
| addItem(`Toolbar.Item item`) : Ext.Toolbar.Item | Toolbar
Adds any Toolbar.Item or subclass
| addSeparator() : Ext.Toolbar.Item | Toolbar
Adds a separator
| addSpacer() : Ext.Toolbar.Item | Toolbar
Adds a spacer element
| addText(`String text`) : Ext.Toolbar.Item | Toolbar
Adds text to the toolbar
| bind(`Ext.data.Store store`) : void | PagingToolbar
Binds the paging toolbar to the specified Ext.data.Store
| getEl() : Ext.Element | Toolbar
Returns the element for this toolbar
| insertButton(`Number index`, `Object/Toolbar.Item/Toolbar.Button (may`) : Ext.Toolbar.Button/Item | Toolbar
Inserts any Toolbar.Item/Toolbar.Button at the specified index
| unbind(`Ext.data.Store store`) : void | PagingToolbar
Unbinds the paging toolbar from the specified Ext.data.Store

## Public Events

This class has no public events.

## Config Options

Config Options | Defined By
--- | ---
| displayMsg : String | PagingToolbar
The paging status message to display (defaults to "Displaying {start} - {end} of {total}")
| emptyMsg : String | PagingToolbar
The message to display when no records are found (defaults to "No data to display")
| pageSize : Number | PagingToolbar
The number of records to display per page (defaults to 20)

## Property Details

### afterPageText

`public String afterPageText`
Customizable piece of the default paging text (defaults to "of %0")
This property is defined by PagingToolbar.

### beforePageText

`public String beforePageText`
Customizable piece of the default paging text (defaults to "Page")
This property is defined by PagingToolbar.

### firstText

`public String firstText`
Customizable piece of the default paging text (defaults to "First Page")
This property is defined by PagingToolbar.

### lastText

`public String lastText`
Customizable piece of the default paging text (defaults to "Last Page")
This property is defined by PagingToolbar.

### nextText

`public String nextText`
Customizable piece of the default paging text (defaults to "Next Page")
This property is defined by PagingToolbar.

### prevText

`public String prevText`
Customizable piece of the default paging text (defaults to "Previous Page")
This property is defined by PagingToolbar.

### refreshText

`public String refreshText`
Customizable piece of the default paging text (defaults to "Refresh")
This property is defined by PagingToolbar.

## Constructor Details

### PagingToolbar

`public function PagingToolbar(`String/HTMLElement/Element container`, `Ext.data.Store store`, `Object config`)`
Create a new PagingToolbar
Parameters:

- `container` : String/HTMLElement/Element
  The id or element that will contain the toolbar
- `store` : Ext.data.Store
  The underlying data store providing the paged data
- `config` : Object
  The config object

## Method Details

### add

`public function add(`Mixed arg1`, `Mixed arg2`, `Mixed etc`)`
Adds element(s) to the toolbar - this function takes a variable number of arguments of mixed type and adds them to the toolbar.
Parameters:

- `arg1` : Mixed
  If arg is a Toolbar.Button, it is added. If arg is a string, it is wrapped in a ytb-text element and added unless the text is "separator" in which case a separator is added. Otherwise, it is assumed the element is an HTMLElement and it is added directly.
- `arg2` : Mixed
- `etc` : Mixed

Returns:

- `void`

This method is defined by Toolbar.

### addButton

`public function addButton(`Object/Array config`)`
Add a button (or buttons), see Ext.Toolbar.Button for more info on the config
Parameters:

- `config` : Object/Array
  A button config or array of configs

Returns:

- `Ext.Toolbar.Button/Array`

This method is defined by Toolbar.

### addDom

`public function addDom(`Object config`)`
Adds a new element to the toolbar from the passed DomHelper config
Parameters:

- `config` : Object

Returns:

- `Ext.Toolbar.Item`
  The element's item

This method is defined by Toolbar.

### addElement

`public function addElement(`String/HTMLElement/Element el`)`
Adds any standard HTML element to the toolbar
Parameters:

- `el` : String/HTMLElement/Element
  The element or id of the element to add

Returns:

- `Ext.Toolbar.Item`
  The element's item

This method is defined by Toolbar.

### addField

`public function addField(`Field field`)`
Add a dynamically rendered Ext.form field (TextField, ComboBox, etc). Note: the field should not have been rendered yet. For a field that has already been rendered, use addElement.
Parameters:

- `field` : Field

Returns:

- `ToolbarItem`

This method is defined by Toolbar.

### addItem

`public function addItem(`Toolbar.Item item`)`
Adds any Toolbar.Item or subclass
Parameters:

- `item` : Toolbar.Item

Returns:

- `Ext.Toolbar.Item`
  The item

This method is defined by Toolbar.

### addSeparator

`public function addSeparator()`
Adds a separator
Parameters:

- None.

Returns:

- `Ext.Toolbar.Item`
  The separator item

This method is defined by Toolbar.

### addSpacer

`public function addSpacer()`
Adds a spacer element
Parameters:

- None.

Returns:

- `Ext.Toolbar.Item`
  The spacer item

This method is defined by Toolbar.

### addText

`public function addText(`String text`)`
Adds text to the toolbar
Parameters:

- `text` : String
  The text to add

Returns:

- `Ext.Toolbar.Item`
  The element's item

This method is defined by Toolbar.

### bind

`public function bind(`Ext.data.Store store`)`
Binds the paging toolbar to the specified Ext.data.Store
Parameters:

- `store` : Ext.data.Store
  The data store to bind

Returns:

- `void`

This method is defined by PagingToolbar.

### getEl

`public function getEl()`
Returns the element for this toolbar
Parameters:

- None.

Returns:

- `Ext.Element`

This method is defined by Toolbar.

### insertButton

`public function insertButton(`Number index`, `Object/Toolbar.Item/Toolbar.Button (may`)`
Inserts any Toolbar.Item/Toolbar.Button at the specified index
Parameters:

- `index` : Number
  The index where the item is to be inserted
- `(may` : Object/Toolbar.Item/Toolbar.Button
  be Array)} item The button, or button config object to be inserted.

Returns:

- `Ext.Toolbar.Button/Item`

This method is defined by Toolbar.

### unbind

`public function unbind(`Ext.data.Store store`)`
Unbinds the paging toolbar from the specified Ext.data.Store
Parameters:

- `store` : Ext.data.Store
  The data store to unbind

Returns:

- `void`

This method is defined by PagingToolbar.

## Config Details

### displayMsg

`displayMsg : String`
The paging status message to display (defaults to "Displaying {start} - {end} of {total}")
This config option is defined by PagingToolbar.

### emptyMsg

`emptyMsg : String`
The message to display when no records are found (defaults to "No data to display")
This config option is defined by PagingToolbar.

### pageSize

`pageSize : Number`
The number of records to display per page (defaults to 20)
This config option is defined by PagingToolbar.

Ext - Copyright © 2006-2007 Ext JS, LLC
All rights reserved.