1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    22
    Answers
    2
    Vote Rating
    0
    Ibrahimp is on a distinguished road

      0  

    Default Answered: checkbox not display inside Ext.grid.Panel - extjs-4.1.0

    Answered: checkbox not display inside Ext.grid.Panel - extjs-4.1.0


    Hi,

    I'm trying creating a grid with multiple checkbox columns -

    var myGridPanel = Ext.create('Ext.grid.Panel', {
    title: 'Permissions',
    store: Ext.data.StoreManager.lookup('userStore'),
    columns: [
    { header: 'Name', dataIndex: 'name' },
    { header: 'Read', dataIndex: 'read' },
    { header: 'Write', dataIndex: 'write', xtype: 'checkcolumn' },
    {
    xtype: 'checkcolumn',
    header: 'readwrite?',
    dataIndex: 'readwrite',
    editor: {
    xtype: 'checkbox',
    cls: 'x-grid-checkheader-editor'

    },
    listeners: {
    checkchange: function (column, recordIndex, checked) {
    alert(checked);
    }
    }
    }

    ],
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
    });


    my data store

    Ext.create('Ext.data.Store', {
    storeId: 'userStore',
    fields: [
    { name: 'name', type: 'string' },
    { name: 'read', type: 'bool' },
    { name: 'write', type: 'bool' },
    { name: 'readwrite', type: 'bool' }
    ],
    data: { 'items': [
    { 'name': 'Lisa', "read": "true", "write": "true", "readwrite": "false" },
    { 'name': 'Bart', "read": "true", "write": "true", "readwrite": "false" },
    { 'name': 'Homer', "read": "true", "write": "true", "readwrite": "false" },
    { 'name': 'Marge', "read": "true", "write": "true", "readwrite": "false" }
    ]
    },
    proxy: {
    type: 'memory',
    reader: {
    type: 'json',
    root: 'items'
    }
    }
    });


    The grid getting formed but check-box is not rendered. I am able to get the checkchange alert though.

    Appreciate your help.

    Thanks,
    Ib

  2. Looks like you don't include plugin css (ux/css/CheckHeader.css)

  3. #2
    Sencha User
    Join Date
    May 2011
    Location
    Ukraine, Rivne
    Posts
    247
    Answers
    44
    Vote Rating
    42
    redraid has a spectacular aura about redraid has a spectacular aura about redraid has a spectacular aura about

      0  

    Default


    Looks like you don't include plugin css (ux/css/CheckHeader.css)

  4. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    22
    Answers
    2
    Vote Rating
    0
    Ibrahimp is on a distinguished road

      0  

    Default


    Worked!! Thanks!!

  5. #4
    Sencha User
    Join Date
    Apr 2013
    Posts
    14
    Vote Rating
    0
    nitinkalra2000 is on a distinguished road

      0  

    Default


    @redraid : I am also facing the same problem but when I included CheckHeader.css, it gave me below error :
    Uncaught SyntaxError: Unexpected token . at
    extjs/examples/ux/css/CheckHeader.css:1

    I am including css in html file as follows :
    <script type="text/javascript" src="extjs/examples/ux/css/CheckHeader.css"></script>

    Could you please help me in solving the issue ?

Thread Participants: 2

Tags for this Thread