Sencha Touch 2:在nestedList中重新加载treeStore以反映用户选择

时间:2014-01-16 08:18:30

标签: javascript extjs sencha-touch sencha-touch-2

我的应用程序中有一个嵌套列表,当用户进行选择时,他们会被带到一个带有一些选项的detailCard。其中一个选择是“确认”他们的选择。确认后,应从列表中删除选择。这适用于服务器端,因此如果刷新应用程序,则选择将消失。但是我希望删除treeStore本身的选择并以某种方式刷新视图,以便用户可以立即看到他们的确认效果。我正在按照nestedList的教程,我似乎找不到了,这段代码基于:

var itemId = '';
Ext.define('MyApp.view.MainView',
{
extend: 'Ext.tab.Panel',
xtype: 'main',
alias: "widget.mainview",

requires: [
    'Ext.dataview.NestedList',
    'Ext.data.proxy.JsonP'
],
config:
{
    tabBarPosition: 'bottom',

    items: [
    {
        xtype: 'nestedlist',
        title: 'Listings',
        iconCls: 'home',
        displayField: 'listingValue',
        scrollable: true,

        detailCard:
        {
            xtype: 'panel',
            scrollable: true,
            styleHtmlContent: true,
            items: [
            {
                xtype: 'fieldset',
                readOnly: true,
                title: 'Schedule Information:',
                items: [
                    {
                        name: 'from',
                        id: 'from',
                        xtype: 'textareafield',
                        label: 'From',
                        readOnly: true
                    },
                    {
                        name: 'to',
                        id: 'to',
                        xtype: 'textareafield',
                        label: 'To',
                        readOnly: true
                    },
                    {
                        name: 'moreInfo',
                        id: 'moreinfo',
                        xtype: 'textfield',
                        label: 'More Info',
                        readOnly: true
                    },

                ]
            },
            {
                xtype: 'container',
                flex: 1,
                items: [
                {
                    xtype: 'button',
                    text: 'Confirm',
                    action: 'confirmSelection',
                    margin: '10 5',
                    padding: '5',
                    ui: 'confirm'
                }]
            }]
        },

        listeners:
        {
            itemtap: function (nestedList, list, index,
                element, post)
            {
                var detailCard = this.getDetailCard();
                detailCard.setHtml('');
                itemId = post.get('id');
                Ext.getCmp('from').setValue(post.get(
                    'from'));
                Ext.getCmp('to').setValue(post.get('to'));
                Ext.getCmp('moreinfo').setValue(post.get(
                    'moreinfo'));

            }

        },



        store:
        {
            type: 'tree',

            fields: [
                'id', 'from', 'to', 'fromcity', 'tocity',
                'time', 'address',
                {
                    name: 'leaf',
                    defaultValue: true
                },

                {
                    name: 'listingValue',
                    convert: function (value, record)
                    {

                        listingValue = '$<b>' + record.get(
                            'address') + '</b> ' + record
                            .get('fromcity') + ' to ' +
                            record.get('tocity');

                        return listingValue;
                    }
                }
            ],

            root:
            {
                leaf: false
            },

            proxy:
            {
                type: 'jsonp',
                url: 'http://myURL.com/page.php?action=go',
                reader:
                {
                    type: 'json',
                    rootProperty: 'root'
                }
            }
        }
    },
    {
        title: 'Dashboard',
        iconCls: 'action',

        items: [
            {
                docked: 'top',
                xtype: 'titlebar',
                title: 'Dashboard'
            },

        ]
    }]
   }
});

此时我不知道该怎么做,因为商店已在视图中设置,我不知道如何在我的控制器中访问它。我了解了treeStore.removeAll()treeStore.load(),但是如果在没有任何类型的引用名称的情况下设置商店,我如何在控制器中调用这些函数?有没有办法可以删除用户的选择并显示视图,或者可能完全重新加载视图,以便它可以从服务器检索新列表?

1 个答案:

答案 0 :(得分:0)

因为我的列表位于我的应用的第一页,所以我设法使用window.location.reload();并重新加载整个应用。它不是最优雅的解决方案,但反映了这些变化。

如果有人提出更好的解决方案,我不会接受我自己的答案。