ExtJs:从两个不同的API加载一个gird

时间:2015-11-01 20:58:42

标签: javascript extjs

我有两个实体,从两个不同的API发送,具有一对一的关系。

我想在同一个网格面板中加载两个模型。问题是我只能加载一个商店。为了加载其他商店,我附加了一个回调到网格重新加载事件,该事件手动编辑网格DOM以从第二个商店插入数据。

我的问题是:我可以加载模型和关联而不使用像我这样的DOM黑客吗?

API中的实体如下所示:

@using (Html.BeginForm("LogOff","Account", FormMethod.Post, new { area = "",  id = "logoutForm", @class = "navbar-right" }))
{
    @Html.AntiForgeryToken()

    <ul class="nav navbar-nav navbar-right">
        <li>
            @Html.ActionLink("Hello " + User.Identity.GetUserName() + "!", "Index", "Manage", routeValues: null, htmlAttributes: new { title = "Manage" })
        </li>
        <li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li>
    </ul>
}

area = ""

注意相同的id,它在API中用作键/外键)。

现在这些是模特:

Get /Users/Details:
{ 
    "Id" : "55b795827572761a08d735ac", 
    "Username" : "djohns", 
    "Email" : "admin@mail.com", 
    "FirstName" : "Davey", 
    "LastName" : "Johns"
}

Get /Users/Rights:
{ 
    "_id" : "55b795827572761a08d735ac", 
    "Status" : "Activated", 
    "Roles" : [
        "portal", 
        "dataApp"
    ]
}

我为用户详细信息定义了一个商店(而用户权限的商店在其自己的模型中):

Ext.define('Portal.model.users.UserRights', {
    extend: 'Ext.data.Model',

    fields: [
        {
            name: 'id',
            mapping: 'Id'
        },
        {
            name: 'Status'
        },
        {
            name: 'UserId',
            mapping: 'Id',
            reference: 'Portal.model.users.UserDetails'
        }
    ],

    schema: {
        namespace: 'Portal.model.users',
        proxy: {
            type: 'rest',
            url: Portal.util.Util.constants.apiBaseURL + 'Users/Rights',
            reader: {
                type: 'json',
                rootProperty: 'Objects'
            }
        }
    }
});

以下是我配置网格的方法:

Ext.define('Portal.model.users.UserDetails', {
    extend: 'Ext.data.Model',
    fields: [
        {
            name: 'id',
            mapping: 'Id'
        }, 
        'FirstName',
        'LastName',
        'Username',
        'Email'
    ],
});

然后我从外部函数加载gird:

Ext.define('Portal.store.UsersDetails', {
    extend: 'Ext.data.Store',
    model: 'Portal.model.users.UserDetails',
    proxy: {
        type: 'rest',
        url: Portal.util.Util.constants.apiBaseURL + 'Users/Details',
        reader: {
            type: 'json',
            rootProperty: 'Objects'
        }
    }
});

0 个答案:

没有答案