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
    450
    Vote Rating
    66
    Answers
    21
    suzuki1100nz is just really nice suzuki1100nz is just really nice suzuki1100nz is just really nice suzuki1100nz is just really nice

      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
    450
    Vote Rating
    66
    Answers
    21
    suzuki1100nz is just really nice suzuki1100nz is just really nice suzuki1100nz is just really nice suzuki1100nz is just really nice

      0  

    Default


    No problem - could you please mark the thread as answered

Thread Participants: 1