cakephp + extjs = b равно нулю ||кт является нулевым

Question

Я скопировал точно такой же код примера разбивки на страницы сетки с сайта extjs в мое представление cakephp, которое выглядит следующим образом:

Ext.onReady(function(){
// create the Data Store
var store = new Ext.data.JsonStore({
    root: 'topics',
    totalProperty: 'totalCount',
    idProperty: 'threadid',
    remoteSort: true,

    fields: [
        'title', 'forumtitle', 'forumid', 'author',
        {name: 'replycount', type: 'int'},
        {name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp'},
        'lastposter', 'excerpt'
    ],

    // load using script tags for cross domain, if the data in on the same domain as
    // this page, an HttpProxy would be better
    proxy: new Ext.data.ScriptTagProxy({
        url: 'http://extjs.com/forum/topics-browse-remote.php'
    })
});
store.setDefaultSort('lastpost', 'desc');


// pluggable renders
function renderTopic(value, p, record){
    return String.format(
            '<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',
            value, record.data.forumtitle, record.id, record.data.forumid);
}
function renderLast(value, p, r){
    return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);
}

var grid = new Ext.grid.GridPanel({
    width:700,
    height:500,
    title:'ExtJS.com - Browse Forums',
    store: store,
    trackMouseOver:false,
    disableSelection:true,
    loadMask: true,

    // grid columns
    columns:[{
        id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
        header: "Topic",
        dataIndex: 'title',
        width: 420,
        renderer: renderTopic,
        sortable: true
    },{
        header: "Author",
        dataIndex: 'author',
        width: 100,
        hidden: true,
        sortable: true
    },{
        header: "Replies",
        dataIndex: 'replycount',
        width: 70,
        align: 'right',
        sortable: true
    },{
        id: 'last',
        header: "Last Post",
        dataIndex: 'lastpost',
        width: 150,
        renderer: renderLast,
        sortable: true
    }],

    // customize view config
    viewConfig: {
        forceFit:true,
        enableRowBody:true,
        showPreview:true,
        getRowClass : function(record, rowIndex, p, store){
            if(this.showPreview){
                p.body = '<p>'+record.data.excerpt+'</p>';
                return 'x-grid3-row-expanded';
            }
            return 'x-grid3-row-collapsed';
        }
    },

    // paging bar on the bottom
    bbar: new Ext.PagingToolbar({
        pageSize: 25,
        store: store,
        displayInfo: true,
        displayMsg: 'Displaying topics {0} - {1} of {2}',
        emptyMsg: "No topics to display",
        items:[
            '-', {
            pressed: true,
            enableToggle:true,
            text: 'Show Preview',
            cls: 'x-btn-text-icon details',
            toggleHandler: function(btn, pressed){
                var view = grid.getView();
                view.showPreview = pressed;
                view.refresh();
            }
        }]
    })
});

// render it
grid.render('topic-grid');

// trigger the data store load
store.load({params:{start:0, limit:25}});});

Теперь, когда я включаю обычные ext-base.js и ext-all.js, я получаю сообщение об ошибке:

b равно нулю

и когда я включаю ext-base-debug.js и ext-all-debug.js, я получаю сообщение об ошибке:

ct равно нулю

и в IE я получаю:

Dom is null

Кто-нибудь сталкивался с такой же проблемой и есть ли решение для нее?

Answer 1

b равно нулю

возможно, вы забудете использовать то же имя идентификатора, что и для div id и renderTo на панели.т.е. <div id="ltGrid"/> и renderTo : 'ltGrid'

Answer 2

Похоже, что элемент DOM отсутствует, и, судя по всему, в вызове рендера:

grid.render('topic-grid');

Вы можете удалить параметр 'topic-grid' или создать элемент <div> с таким идентификатором в разметке.