View Full Version : Got errorwith using of paging toolbar

1 Aug 2013, 4:04 PM
Hi! I'm using ExtJs for generating several grids on a page. Also i using paging toolbar. Some of grid works good but For some i get error "'dom' is null". I can not gues why but Ext library do not generate table tag for numberfieald. I tried both ways to generate paging toolbar (Ext.create() and dockedItems: [{xtype: 'pagingtoolbar'...,) and still get the error.
Am I doing something wrong or it is Extjs bug?

1 Aug 2013, 11:05 PM
which version of ExtJS are you using and it would help to take a look at your code to see if there is anything wrong there.

2 Aug 2013, 1:58 AM
Hi Farish

I'm using ExtJs

Code for Store and Grid:

var defaultPageSize = 20;
var store = new Ext.data.Store({
model: 'mod1',
purgePageCount: 1,
pageSize: defaultPageSize,
remoteSort: false,
autoSync: true,
remoteFilter: true,
stateful: true,
id: 'id',
proxy: {
type: 'ajax',
actionMethods: {
read: 'POST'
url: data.url,
reader: {
type: 'json',
totalProperty: 'total',
root: 'rows' }},
autoLoad: {start: 0, limit: defaultPageSize}

var grid = Ext.create('Ext.grid.Panel', {
store: store,
renderTo: data.id,
dockedItems: [{
xtype: 'pagingtoolbar',
store: store,
dock: 'bottom',
displayInfo: true}],
loadMask: Ext.LoadMask({msg:"Please wait..."}),
columns: columns,
height: 400,
width: "100%",
forceFit: true,
collapsible: false,
clearOnPageLoad: false,
autoFitColumns: true,
productionQuality: true,
viewConfig: {
stripeRows: true,
autoFill: true, loadingText: 'loading...'}

firebug logs error in ext-all-dev.js:41059

2 Aug 2013, 2:11 AM
I dont see anything wrong just by looking at it. Can you extract a working example and see if you still have the error? Also, remove unnecessary stuff like viewConfig etc. and see if that makes a difference. Its not recommended to use 'id' as id.

2 Aug 2013, 2:41 AM
yes, i'm still getting error

here is trace info

Uncaught TypeError: Cannot read property 'dom' of null ext-all-dev.js:41059
Ext.define.finishRender ext-all-dev.js:41059
Ext.define.finishRenderItems ext-all-dev.js:51828
Ext.define.finishRender ext-all-dev.js:52274
Ext.define.finishRenderChildren ext-all-dev.js:55228
Ext.define.afterRender ext-all-dev.js:40787
Base.implement.callParent ext-all-dev.js:6949
Ext.define.afterRender ext-all-dev.js:49334
Ext.define.finishRender ext-all-dev.js:41086
Ext.define.finishRenderItems ext-all-dev.js:51828
Ext.define.finishRender ext-all-dev.js:73086
Ext.define.finishRenderChildren ext-all-dev.js:41103
Base.implement.callParent ext-all-dev.js:6949
Ext.define.finishRenderChildren ext-all-dev.js:55223
Ext.define.afterRender ext-all-dev.js:40787
Base.implement.callParent ext-all-dev.js:6949
Ext.define.afterRender ext-all-dev.js:49334
Ext.define.finishRender ext-all-dev.js:41086
Ext.define.render ext-all-dev.js:41412
Ext.define.constructor ext-all-dev.js:43560
Base.implement.callParent ext-all-dev.js:6949
Ext.define.constructor ext-all-dev.js:49276
constructor ext-all-dev.js:8158
(anonymous function)
Ext.ClassManager.instantiate ext-all-dev.js:8908
(anonymous function) ext-all-dev.js:3385
gridExt gridExt.js:216
(anonymous function) account-management:139
(anonymous function) ext-all-dev.js:16064
fire ext-all-dev.js:16019
Ext.apply.readyEvent.readyEvent.fire ext-all-dev.js:16277
Ext.apply.fireReadyEvent ext-all-dev.js:16377
(anonymous function) ext-all-dev.js:3332

2 Aug 2013, 2:45 AM
hmmm. what if you remove the paging toolbar also and just test with the grid?

2 Aug 2013, 3:08 AM
it works good without paging.

2 Aug 2013, 3:11 AM
ok then try the following in your grid. its the same and may be doesnt help:

bbar: Ext.create('Ext.PagingToolbar', {
store: store,
displayInfo: true,
displayMsg: ' {0} - {1} of {2}'

if nothing changes, then the problem might be somewhere else in your application. I havent had any errors in using the paging toolbar.

2 Aug 2013, 3:54 AM
Thank You, but nothing changed.

fixed. my faul