Sencha Touch : Trying to add a list to a panel

Question

I have a panel which consists of a textbox, button and ListView. I believe I have this set up correctly except for the list. Listview doesn't show up with data from store. Please hel I am trying to add as follows:

Ext.define('Abc.view.Trains', {
extend: 'Ext.Panel',
xtype:'searchtrains',
requires: [ 'Ext.dataview.List','Ext.Label','Ext.form.FieldSet'
'Abc.view.SearchTrainResults','Abc.view.SampleList'],
config: {
    title: 'Train Enquiry',
    items: [


        {
            xtype: 'fieldset',
            style:'width:74%;  float:left',
            margin:'10px',
            items: 
                {
                    xtype: 'textfield',
                    placeHolder: 'Username',
                    itemId: 'trainNoTextField',
                    name: 'trainNoTextField',
                    required: true
            }

        },
        {
            xtype: 'button',
            itemId: 'trainSearchButton',
            ui: 'action',
            padding: '10px',
            text: 'Go',
            style:'width:20%; margin-top:10px; float:right'
        },
        {
            xtype: 'sampList',
        }
     ]
    ]};

Abc/view/SampleList

  Ext.define('Abc.view.SampleList', {
extend: 'Ext.List',
xtype: 'sampList',
requires: ['TrainEnquiry.store.SampleList'],

config: {
    title: 'Train Enquiry',
        itemTpl: '<div class="myContent">'+ 
                '<div><b>{status}</b> </div>' +
                '</div>',
        store: 'SampleList',
},
});

Abc/store/SampleList

  Ext.define('Abc.store.SampleList', {
extend: 'Ext.data.Store',

config: {
    fields: ['status'],
    data: [
        { status: "Live! Train Statusjhgkbvdsbvfbnsdfvsdgfjasdgjhagsdhjasgdahjsgdjhasdbahjsgdsajhdgahjsgdashdgajhsdgajhsdvahjsdg" },
        { status: "Live! Station Statustusjhgkbvdsbvfbnsdfvsdgfjasdgjhagsdhjasgdahjsgdjhasdbahjsgdsajhdgahjsgdashdgajhsdgajhsdvahjsdg" },
        { status: "Train Time Tabletusjhgkbvdsbvfbnsdfvsdgfjasdgjhagsdhjasgdahjsgdjhasdbahjsgdsajhdgahjsgdashdgajhsdgajhsdvahjsdg"}
    ]
}
});

Answer 1

Something like this?

Ext.define('Abc.view.Trains', {
extend: 'Ext.Panel',
xtype:'searchtrains',
requires: ['Ext.dataview.List','Ext.Label','Ext.form.FieldSet','Abc.view.SampleList'],
config: {
title: 'Train Enquiry',
layout:'vbox',
items: [
{
    flex:1,
    xtype:'panel',
    layout:'hbox',
    items:[{
        flex:2,
        xtype: 'fieldset',
        style:'width:74%;  float:left',
        margin:'10px',
        items: 
        {
            xtype: 'textfield',
            placeHolder: 'Username',
            itemId: 'trainNoTextField',
            name: 'trainNoTextField',
            required: true
        }
    },{
        flex:1,
        xtype: 'button',
        itemId: 'trainSearchButton',
        ui: 'action',
        padding: '10px',
        text: 'Go',
        style:'width:20%; margin-top:10px; float:right'
    }]
},{
    flex:10,
    xtype: 'sampList',
}]
}
});