2015-11-23 1 views
0

ExtJs код нумерации не работает должным образом на Firefox, оно работает собственное на другом браузере, как IE10, Chrome и т.д.ExtJs4.1.1 pagingToolBar не работал на Firefox

Я работал с ExtJS 4.1.1. , и на этой части я определил панель разбиения на страницы для comboGrid и, согласно этой работе, работал. я закодирован что-то вроде этого:

var bar = new Ext.PagingToolbar({ 
    store: Store, 
    displayInfo: true, 
    itemid:'paginationToolbar', 
    items: [ 
    '-', 
    'Per Page: ', 
    combo],   
    displayMsg: 'Display {0} - {1} of {2}', 
    emptyMsg: "No display", 
    handleRefresh: Ext.emptyFn, 
    doRefresh: function() { 
     // Logic 
    } 
}); 

и применять эту планку методы Ext.apply.

+2

Пожалуйста, сделайте скрипку (https://fiddle.sencha.com/#home), которая работает в других браузерах, но не в Firefox. Я рассмотрю этот вопрос, как только ваша скрипка будет готова. – Alexander

ответ

0

Дамп ваших данных на JSON на теле страницы, используйте вместо этого jQuery's plugin.

См. loading data (JSON) и Pivot Grid Примеры.

+0

Если вы работаете с ExtJS для создания сеток и т.п. с разбивкой на страницы, это не будет очень разумным выбором imo. – hbulens

+0

@hbulens, что вы думаете. Если вы работаете в технической отрасли, вы бы знали, что более практично писать гибриды, которые хорошо работают, кроме как пуриста, который занимает 4 недели, чтобы найти решение сетки;) О , и jqGrid имеет тот же внешний вид, что и extjs, и каждый загружает некоторые jQuery в конечном итоге на страницу, поэтому нет реальных причин, почему вы не должны этого делать. Теперь. –

0

Я написал что-то об этом на моем blog, имел аналогичную проблему недавно. Код ниже работает на ExtJS 4 (не может вспомнить версию), и он определенно работает с ExtJS 6.0.0 и ExtJS 6.0.1. Я был бы удивлен, что причиной будет номер версии, поскольку исходное сообщение в блоге, которое я основал на датах от нескольких лет назад, так что он должен работать с любой версией, которую вы выбираете.

Ext.define('Ext.toolbar.PagingComboToolbar', { 
extend: 'Ext.PagingToolbar', 
displayInfo: true, 
pageSize: 50, 
displayMsg: 'Display {0} - {1} of {2}', 
emptyMsg: "No display", 
initComponent: function() { 
    var me = this; 
    this.store.pageSize = this.pageSize; 
    var combo = new Ext.form.ComboBox({ 
     name: 'perpage', 
     width: 75, 
     store: new Ext.data.ArrayStore({ 
      fields: ['id'], 
      data: [ 
       ['10'], 
       ['20'], 
       ['50'], 
       ['75'], 
       ['100'], 
       ['150'] 
      ] 
     }), 
     value: this.pageSize, 
     listWidth: 70, 
     triggerAction: 'all', 
     displayField: 'id', 
     valueField: 'id', 
     editable: false, 
     forceSelection: true, 
     listeners: { 
      select: { 
       fn: function (combo, record) { 
        var newPagesize = parseInt(record.get('id'), 10); 
        this.pageSize = newPagesize; 
        this.store.pageSize = newPagesize; 
        this.store.loadPage(this.store.currentPage); 
       }, 
       scope: this 
      } 
     } 
    }); 

    Ext.apply(this, { 
     items: [ 
      'Per page: ', 
      combo 
     ] 
    }); 

    this.callParent(arguments); 
} 
}); 

Вы тогда называть это так:

var bar = new Ext.toolbar.PagingComboToolbar({ 
store: Store,  
handleRefresh: Ext.emptyFn, 
doRefresh: function() { 
    // Logic 
} 
}); 

Естественно, если ваш выпадающий ведет себя немного по-другому, вы можете заменить его. Или вы можете расширить весь класс, чтобы он мог принимать comoboxes в конструкторе, например.

Смежные вопросы