Question

我想知道是否可以动态创建网格视图。我会尽力解释......

我目前有一个具有不同区域的数据库表，我已经围绕此创建了一个网格，您可以在此网格中添加新条目，然后将其添加到表格中。

我还有一个联系人的数据库表，其中包含姓名，电话号码，并将所有区域用作下拉列表。您可以再次通过网格在此表中添加新条目。

最后，我有第三个网格，显示所有联系人，分解到他们的区域。我遇到的问题是如何让它变得动态？目前我已经对区域标题进行了硬编码并填充了正确过滤的网格，但是如果有人完全添加了一个新区域呢？如何使用适当的过滤器为新添加的区域创建标题和网格？

第三个网格代码：

Ext.define('myproject.example', {
    extend: 'Ext.form.Panel',
    alias: 'widget.********',

    requires: [
        'store.exampleStore'
    ],
    modal: true,
    draggable: true,
    header: {
        title: 'Technical Advisors Contact Information',
        height: 55,
        items: [{
            xtype: 'button',
            text: 'X',
            listeners: { click: 'onModalX' }
        }]
    },
    scrollable: true,
    align: 'center',
    floating: true,
    width: 1500,
    height: 800,

    items: [{
        xtype: 'grid',
        title: 'Region: ME',
        scrollable: true,
        collapsible: true,
        store: { type: 'exampleStore', filters: [{ property: 'Region', value: 'ME' }, { property: 'Active', value: 'true' }] },
        columns: [{
            text: 'Contact',
            dataIndex: 'ContactName',
            sortable: true,
            flex: 2
        }, {
            text: 'Office #',
            dataIndex: 'Office',
            sortable: true,
            flex: 1
        }, {
            text: 'Home #',
            dataIndex: 'Home',
            sortable: true,
            flex: 1
        }, {
            text: 'Pager #',
            dataIndex: 'Pager',
            sortable: true,
            flex: 1
        }, {
            text: 'Cellular #',
            dataIndex: 'Cellular',
            sortable: true,
            flex: 1
        }, {
            text: 'Area',
            dataIndex: 'Region',
            sortable: true,
            flex: 3
        }] //continues...

Answer 1

首先，您需要在客户端（在浏览器中）获取数据。这可以通过ajax请求（jsonp，ext.direct，rest等）来完成。

然后您可以将数据加载到商店中：

grid.store.loadData(result.data);

您可以手动执行此操作，也可以阅读extjs中的代理。最简单的方法是rest-proxy。

动态创建网格EXTJS

1 个答案: