1. #1
    Sencha User
    Join Date
    Nov 2012
    Posts
    2
    Vote Rating
    0
    yogesh2810 is on a distinguished road

      0  

    Default Answered: Datalist item is not appearing in panel

    Answered: Datalist item is not appearing in panel


    Hi
    I am new to Sencha touch trying to add dataview inside panel but dataview is not showing up. Here is code

    Except dataview every other control is appearing perfectly

    Ext.define('MyApp.view.Number', {
    extend: 'Ext.Panel',

    xtype: 'CBNumberPanel',
    id: 'numberPanel',

    requires: ['Ext.field.Text', 'Ext.dataview.DataView'],

    config: {
    //add 2 panels vertically divided
    //name: 'numberentrybox'
    //name: 'numberpad', 'scorelisting'
    align: 'start',
    pack: 'start',
    layout: 'hbox',
    fullscreen: true,
    scrollable: true,

    // This is property defined in this class
    // property can be accessed using getEnteredNumber() and setEnteredNumber(X)
    enteredNumber : '',

    items: [
    {
    xtype: 'panel',
    id: 'numberentrybox',
    docked: 'top',
    layout: 'hbox',
    style: { 'border-bottom': '2px solid blue' },
    border: 1,
    align: 'center',
    pack: 'center',
    items: [
    { xtype: 'button', text: 'Hint', margin: 4, id: 'hint', action: 'hintclicked', docked:'right' },

    {
    align: 'center', pack: 'center', id: 'enterednum', xtype: 'textfield', centered: false, readonly: true, maxLength: 4, id: 'enterednumber', margin: 1, align:'center', pack: 'center', style: 'border-color: grey; border-style: solid;'
    },


    { xtype: 'button', text: 'Give Up', margin: 4, id: 'giveup', action: 'giveupclicked', docked:'left' }
    ]
    },//numberentrybox
    {
    xtype: 'panel',
    id: 'numberpadpanel',
    layout: 'vbox',
    flex: 1,
    items: [
    {
    xtype: 'container',
    id: 'line1',
    layout: 'hbox',
    align: 'center',
    pack: 'center',
    items: [
    { xtype: 'button', text: '1', margin: 4, id: 'one', action: 'numberclicked' },
    { xtype: 'button', text: '2', margin: 4, id: 'two', action: 'numberclicked' }
    ]
    },
    {
    xtype: 'container',
    id: 'line2',
    layout: 'hbox',
    align: 'center',
    pack: 'center',
    items: [
    { xtype: 'button', text: '3', margin: 4, id: 'three', action: 'numberclicked' },
    { xtype: 'button', text: '4', margin: 4, id: 'four', action: 'numberclicked' }
    ]
    },
    {
    xtype: 'container',
    id: 'line3',
    layout: 'hbox',
    align: 'center',
    pack: 'center',
    items: [
    { xtype: 'button', text: '5', margin: 4, id: 'five', action: 'numberclicked' },
    { xtype: 'button', text: '6', margin: 4, id: 'six', action: 'numberclicked' }
    ]
    },
    {
    xtype: 'container',
    id: 'line4',
    layout: 'hbox',
    align: 'center',
    pack: 'center',
    items: [
    { xtype: 'button', text: '7', margin: 4, id: 'seven', action: 'numberclicked' },
    { xtype: 'button', text: '8', margin: 4, id: 'eight', action: 'numberclicked' }
    ]
    },
    {
    xtype: 'container',
    id: 'line5',
    layout: 'hbox',
    align: 'center',
    pack: 'center',
    items: [
    { xtype: 'button', text: '9', margin: 4, id: 'nine', action: 'numberclicked' },
    { xtype: 'button', text: '0', margin: 4, id: 'zero', action: 'numberclicked' }
    ]
    },
    { xtype: 'button', text: 'Enter', margin: 4, ui:'confirm', action: 'enterclicked' },
    { xtype: 'button', text: 'delete', margin: 4, action: 'deleteclicked' }
    ]
    }, //numberpad
    {
    xtype: 'panel',
    id: 'scorepanel',
    layout: 'vbox',
    html: 'score',
    flex: 2,
    border: 1,
    style: { 'border-left': '2px solid blue' },//style: 'border-color: red; border-style: solid;'
    title: 'score List',
    items: [
    //{ xtype: 'button', text: 'AAA', margin: 4, ui:'confirm'},
    //{ xtype: 'button', text: 'BBB', margin: 4},
    {
    xtype: 'dataview',
    id: 'scorelistbox',
    store: {
    fields: ['name', 'age'],
    data: [
    {name: 'Jamie', age: 100},
    {name: 'Rob', age: 21},
    {name: 'Tommy', age: 24},
    {name: 'Jacky', age: 24},
    {name: 'Ed', age: 26}
    ]
    },

    itemTpl: '<div>{name} is {age} years old</div>'
    }
    ]
    } // scorepanel
    ] // items on viewport or main canvas


    } // config

    });




  2. Try giving your dataview a height

  3. #2
    Touch Premium Member suzuki1100nz's Avatar
    Join Date
    Apr 2011
    Location
    New Zealand
    Posts
    446
    Answers
    21
    Vote Rating
    62
    suzuki1100nz is a jewel in the rough suzuki1100nz is a jewel in the rough suzuki1100nz is a jewel in the rough suzuki1100nz is a jewel in the rough

      0  

    Default


    Try giving your dataview a height

  4. #3
    Sencha User
    Join Date
    Nov 2012
    Posts
    2
    Vote Rating
    0
    yogesh2810 is on a distinguished road

      0  

    Default


    Hi suzuki1100nz,

    Thanks for taking time to answer my query

    Can't believe it was that simple

    After adding height:100 to dataview it showed up

    thanks a ton !!!!

  5. #4
    Touch Premium Member suzuki1100nz's Avatar
    Join Date
    Apr 2011
    Location
    New Zealand
    Posts
    446
    Answers
    21
    Vote Rating
    62
    suzuki1100nz is a jewel in the rough suzuki1100nz is a jewel in the rough suzuki1100nz is a jewel in the rough suzuki1100nz is a jewel in the rough

      0  

    Default


    No problem - could you please mark the thread as answered

Thread Participants: 1