1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    4
    Vote Rating
    0
    manoj12 is on a distinguished road

      0  

    Default Issue with grid pagination with combo box

    Issue with grid pagination with combo box


    We are trying pagination of data grid with combo box. On selection of combo, data in grid would be changed. The issue we are facing is with pagination. When initially page loads, it displays all the records and correct pagination but when we change the category in combo, the grid data gets changed but the pagination doesn't update and it still shows the all data count. I have attached the screenshots for reference. Please let me know how can this be solved?

    Thanks
    Manojimage1.jpgimage2.jpg

    Code:

    Ext.onReady(function() {
    var itemsPerPage = 5;
    var myStore = new Ext.data.Store({ //store for faqGrid starts
    //autoLoad: true,
    autoLoad: {start: 0},
    //autoLoad: {start: 0, limit: 4},
    fields: ['QUESTION_ID', 'answer', 'question', 'categoryId'],
    pageSize: itemsPerPage,

    proxy: {
    type: 'ajax',
    api: {
    read : 'view.action'
    },
    reader: {
    type: 'json',
    root: 'data',
    totalProperty: 'total',
    successProperty: 'success'
    },
    writer: {
    type: 'json',
    writeAllFields: true,
    encode: false,
    root: 'data'
    },
    listeners: {
    exception: function(proxy, response, operation){
    Ext.MessageBox.show({
    title: 'REMOTE EXCEPTION',
    msg: operation.getError(),
    icon: Ext.MessageBox.ERROR,
    buttons: Ext.Msg.OK
    });
    }
    }
    }
    }); //store for faqGrid ends
    // specify segment of data you want to load using params
    /* myStore.load({
    params:{
    start:0,
    limit: 4,
    }
    });*/

    var faqGrid = new Ext.grid.GridPanel({
    id: 'faqGrid',
    // title: 'FAQs',
    hideHeaders: true,
    width : 688,
    height : 440,
    renderTo : 'grid-faq',
    store : myStore,
    stripeRows: true,
    viewConfig: {
    trackOver: false,
    stripeRows: false,
    emptyText:'No FAQ to display'
    },
    columns: [
    {
    colspan :1,
    width: 665,
    collapsible: true,
    renderer: renderTopic,
    }
    ] ,

    });

    function renderTopic(value, p, record) {

    return Ext.String.format(
    "<h4><p style='white-space:normal'>"+record.data.question+'</p>'+"</h4><p style='white-space:normal'>"+record.data.answer+'</p>',
    value
    );
    };

    //Category ComboBox field
    var category = new Ext.form.ComboBox({
    fieldLabel:'Category',
    name:'category',
    labelAlign: 'left',
    labelWidth:100,
    width:350,
    emptyText:'Select Category',
    id:'category',
    //padding:2,
    //layout : 'absolute',
    store:Ext.create('Ext.data.Store', {
    autoLoad: true,
    fields: ['categoryId','category'],
    proxy: {
    type: 'ajax',
    url: 'category.action',
    reader: {
    type:'json',
    root: 'category',
    totalProperty: 'total'
    }
    },
    storeId: 'categoryStore',
    root: 'category'

    }),
    queryMode: 'local',
    displayField: 'category',
    valueField: 'categoryId',
    //allowBlank: false,
    msgTarget: 'side',
    // blankText:'Please Select category',
    id:"category",
    listeners:
    {
    select: function(combo, value,index)
    {
    //alert(combo.getValue());
    Ext.getCmp('faqGrid').store.clearFilter();
    // Ext.getCmp('faqGrid').clearValue();
    Ext.getCmp('faqGrid').store.filter('categoryId', combo.getValue());
    // myStore.filter('categoryId', combo.getValue());
    // Ext.getCmp('pagination').getBottomToolbar().updateInfo();
    }
    }
    });


    var win = new Ext.Window({
    title: 'FAQ',
    width:705,
    height:535,
    closable: false,
    resizable: false,
    draggable:false,
    layout : 'anchor',
    bodyStyle:'background-color:#fff;padding: 5px',

    dockedItems: [{ xtype: 'pagingtoolbar',
    dock:'bottom',
    id:'pagination',
    //height:40,
    // width:650,
    store: myStore,
    displayInfo: true,
    displayMsg: 'Displaying contacts {0} - {1} of {2}',
    emptyMsg: "No contacts to display",
    listeners:
    {
    select: function(category, record) {
    this.pageSize = parseInt(record.get('id'), 5);
    this.doLoad(bbar.cursor);
    }
    }
    },category,
    faqGrid],

    buttonAlign: 'right',
    buttons:[{
    text:'Back',
    handler:function(){
    var redirect = 'dashboard.jsp';
    window.location = redirect;
    }
    }] ,
    renderTo: Ext.getBody()
    });
    win.show();
    });

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,639
    Vote Rating
    400
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Is your server returning the correct information in the response?

    see:
    http://www.sencha.com/forum/showthread.php?211260

    Scott.

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar