1. #111
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,522
    Vote Rating
    814
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    docking toolbars in a dataview, the scroller won't update it's size to allow for scrolling fully. Adding a bottom margin helps.

    Code:
    .touchgridpanel .x-dataview-container {
        margin-bottom : 2.5em;
    }
    For example.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  2. #112
    Sencha User
    Join Date
    Apr 2012
    Posts
    4
    Vote Rating
    0
    Eugene Ivakhiv is on a distinguished road

      0  

    Default


    The code you've provided is already in Ext.ux.grid.View.css
    However it does not influence visibility of bottom docked toolbar which is still below the visible area.

  3. #113
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,522
    Vote Rating
    814
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Quote Originally Posted by Eugene Ivakhiv View Post
    The code you've provided is already in Ext.ux.grid.View.css
    However it does not influence visibility of bottom docked toolbar which is still below the visible area.
    Looking good for me.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #114
    Sencha User
    Join Date
    Apr 2012
    Posts
    4
    Vote Rating
    0
    Eugene Ivakhiv is on a distinguished road

      0  

    Default


    I think this is some kind of misunderstanding.

    Mentioned margin has nothing to do with the bottom toolbar. Can you try it for yourself?
    Just change toolbar docked attribute from 'top' to 'bottom' in showhide.js

  5. #115
    Sencha User
    Join Date
    Apr 2012
    Posts
    70
    Vote Rating
    0
    mukeshgla is on a distinguished road

      0  

    Default Issue in display after increasing column numbers

    Issue in display after increasing column numbers


    Hi,

    I have increased the number of columns from 5 to 10, but the grid view is distorted, can anyone please tell me how to render propersencha.jpg

  6. #116
    Sencha User
    Join Date
    Feb 2012
    Posts
    4
    Vote Rating
    0
    elastoffice is on a distinguished road

      0  

    Default Remote sorting

    Remote sorting


    I have a direct store and I have set remoteSorting: true.
    The problem is that the remote sorting doesn't work with the grid plugin.
    Remote sorting is supported?

  7. #117
    Sencha Premium Member couetbis's Avatar
    Join Date
    Jan 2008
    Location
    Nantes - France
    Posts
    105
    Vote Rating
    1
    couetbis is on a distinguished road

      0  

    Default


    Hi,
    I use grid, and thanks for this.
    Is it possible to change label header on the fly ?

    I want to rename the labels header depending on the values ​​of a previous screen.

  8. #118
    Sencha User
    Join Date
    Apr 2012
    Posts
    9
    Vote Rating
    1
    AnujaSonawane is on a distinguished road

      0  

    Default


    hello,
    i am using a tabpanel and in that i have used the view.js

    The code is given as below:

    /**
    * @author Manish Kumar
    * This file contain UI design for entryReport
    * entryReportPanel is xtype that will calls different tab panel
    */


    Ext.require([
    'Ext.ux.touch.grid.View'
    ]);

    Ext.define('TestModel', {
    extend : 'Ext.data.Model',
    fields : [
    'company',
    'price',
    'change',
    'pct',
    'updated'
    ]
    });

    var store = Ext.create('Ext.data.Store', {
    model : 'TestModel',
    autoLoad : true,
    data:[{company:'abc',price:234,change:'no',pct:'yes',updated:'yes'}]

    });





    Ext.define('Main.view.entryReportPanel', {
    extend: 'Ext.Panel',
    xtype:'entryReportPanel',

    config: {
    layout: 'card',
    },
    /*
    entryReportPanel = Ext.extend(Ext.Panel, {

    layout: 'card',*/


    listeners: {
    afterrender: function(){
    this.parent.doComponentLayout();
    },
    },

    initialize: function() {



    this.tabPanel = new Ext.TabPanel({
    type: 'dark',
    dock: 'top',
    animation: 'cube',

    items: [{
    xtype: 'toolbar',
    docked: 'top',
    layout: {
    pack: 'justify',
    },
    defaults: {
    iconMask: true,
    ui: 'plain'
    },
    items: [{
    xtype : 'button',
    iconCls: 'refresh',
    iconAlign: 'right',
    showAnimation: true,
    scope: this,
    handler: function() {
    var tab = this.tabPanel.getActiveItem();
    tab.onRefresh(tab);
    }

    }, {
    xtype: 'segmentedbutton',
    items: [{
    text: 'Natraj Gas',
    cls: 'mainAppTitle',
    handler: function() {
    client.showInfoWindow(); // It will work like a popup window

    }
    }],

    }, {
    xtype : 'button',
    iconCls: 'settings',
    iconAlign: 'left',
    showAnimation: true,
    handler: function() {
    client.showSettingsWindow(); // It will work like a popup window
    }
    }]

    },{
    xtype : 'touchgridpanel',
    title: '24 Hours',
    width:'100%',
    duration: 1,
    store : store,
    colModel : [
    {
    header : 'Company',
    dataIndex : 'company',
    style : 'padding-left: 1em;',
    width : '40%',
    sortable : false,
    filter : { type : 'string' }
    },
    {
    header : 'Price',
    dataIndex : 'price',
    style : 'text-align: center;',
    width : '15%',
    filter : { type : 'numeric' }
    },
    {
    header : 'Change',
    dataIndex : 'change',
    cls : 'centered-cell',
    width : '15%',
    renderer : function(value, values) {
    var color = (value > 0) ? '009933' : 'FF0000';
    return '<span style="color: #' + color + ';">' + value + '</span>';
    }
    },
    {
    header : '% Change',
    dataIndex : 'pct',
    cls : 'centered-cell',
    width : '15%',
    renderer : function(value, values) {
    var color = (value > 0) ? '009933' : 'FF0000';
    return '<span style="color: #' + color + ';">' + value + '</span>';
    }
    },
    {
    header : 'Last Updated',
    dataIndex : 'updated',
    hidden : true,
    style : 'text-align: right; padding-right: 1em;',
    width : '15%'
    }
    ]

    }, {
    //xtype: 'gridEntryReportPanel',
    title: '7 Days',
    duration: 7,
    }, {
    //xtype: 'gridEntryReportPanel',
    title: '30 Days',
    duration: 30,

    }]

    });
    this.add(this.tabPanel);
    this.callParent(arguments);
    //entryReportPanel.superclass.initComponent.call(this);
    },
    });




    The control is not displayed as in only the toolbar is displayed partially in the top left corner
    can someone please help.
    I am not getting this control to work for me

  9. #119
    Sencha User
    Join Date
    Feb 2012
    Posts
    67
    Vote Rating
    1
    Soenhay is on a distinguished road

      0  

    Default


    Quote Originally Posted by couetbis View Post
    Hi,
    I use grid, and thanks for this.
    Is it possible to change label header on the fly ?

    I want to rename the labels header depending on the values ​​of a previous screen.

    I do this by getting the new column information from a previous view then destroying and recreating the grid with the new column information........ If there is a better way I would also like to know.

  10. #120
    Sencha User
    Join Date
    Feb 2012
    Posts
    67
    Vote Rating
    1
    Soenhay is on a distinguished road

      0  

    Default


    If you download the SmartGlance demo on your phone you will see that there is a feature where u can swipe multiple columns while keeping some columns frozen.

    How would I implement something like this with your grid?