Question

我正在使用我的extjs app的架构来自这篇博文 http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/ 所以这是我的index.html请阅读完整的问题以获得完整的答案。

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Reseller DashBoard</title>

    <!-- ** CSS ** -->
    <!-- base library -->
    <link rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all.css" />
    <link rel="stylesheet" type="text/css" href="./ext/resources/css/xtheme-gray.css" />

    <!-- overrides to base library -->

    <!-- ** Javascript ** -->
    <!-- ExtJS library: base/adapter -->
    <script type="text/javascript" src="./ext/adapter/ext/ext-base-debug.js"></script>

    <!-- ExtJS library: all widgets -->
    <script type="text/javascript" src="./ext/ext-all-debug.js"></script>

    <!-- overrides to base library -->

    <!-- page specific -->
    <script type="text/javascript" src="application.js"></script>
    <script type="text/javascript" src="js/Application.dashboard.js"></script>
    <script type="text/javascript" src="js/jsfunction.js"></script>
    <script type="text/javascript" src="js/reseller.js"></script>


</head>
<body>

    <div id="dashboard">
    </div>
</body>
</html>

这是我的应用程序。我在这里是我的仪表板网格，它是正确的初始化地点吗？

/*global Ext, Application */

Ext.BLANK_IMAGE_URL = './ext/resources/images/default/s.gif';
Ext.ns('Application');

// application main entry point
Ext.onReady(function() {

    Ext.QuickTips.init();
    var pg = new Application.DashBoardGrid();

    // or using it's xtype
    var win = new Ext.Window({
         items:{xtype:'DashBoardGrid'}
    });

    // code here

}); // eo function onReady

// eof

这是我的Application.DashBoardGrid.js 我对api的请求现在正在进行两次为什么？我有一个linkrenderer函数用于渲染列，我应该把这个函数放在哪里？并建议为什么我的网格不会来？

Application.DashBoardGrid = Ext.extend(Ext.grid.GridPanel, {
     border:false
    ,initComponent:function() {
        var config = {
            store:new Ext.data.JsonStore({
                // store configs
                autoDestroy: true,
                autoLoad :true,
                url: 'api/index.php?_command=getresellerscount',
                storeId: 'getresellerscount',
                // reader configs
                root: 'cityarray',
                idProperty: 'cityname',
                fields: [
                    {name: 'cityname'},
                    {name: 'totfollowup'},
                    {name: 'totcallback'},
                    {name: 'totnotintrested'},
                    {name: 'totdealsclosed'},
                    {name: 'totcallsreceived'},
                    {name: 'totcallsentered'},
                    {name: 'totresellerregistered'},
                    {name: 'countiro'},
                    {name: 'irotransferred'},
                    {name: 'irodeferred'}
                ]
            })
            ,columns: [
                {
                    id       :'cityname',
                    header   : 'City Name', 
                    width    : 120, 
                    sortable : true, 
                    dataIndex: 'cityname'
                },
                {
                    id       :'countiro',
                    header   : ' Total Prospect', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'countiro'
                },
                 {
                    id       :'irotransferred',
                    header   : 'Calls Transfered By IRO', 
                    height : 50,
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'irotransferred'
                },
                {
                    id       :'irodeferred',
                    header   : ' Calls Deferred By IRO', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'irodeferred'
                },
                {
                    id       :'totcallsentered',
                    header   : ' Total Calls Entered', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex : 'totcallsentered'//,
                    //renderer : linkRenderer
                },
                {
                    id       :'totfollowup',
                    header   : ' Follow Up', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'totfollowup'
                },
                {
                    id       :'totcallback',
                    header   : ' Call Backs', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'totcallback'
                },
                {
                    id       :'totnotintrested',
                    header   : ' Not Interested', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'totnotintrested'
                },
                {
                    id       :'totdealsclosed',
                    header   : ' Deals Closed', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'totdealsclosed'
                },
                 {
                    id       :'totresellerregistered',
                    header   : ' Reseller Registered', 
                    width    : 100, 
                    sortable : true, 
                    dataIndex: 'totresellerregistered'
                }
            ]
          ,plugins:[]
          ,viewConfig:{forceFit:true}
          ,tbar:[]
          ,bbar:[]
          ,render:'dashboard'
          ,height: 350
          ,width: 1060
           ,title: 'Reseller Dashboard'
        }; // eo config object

        // apply config
        Ext.apply(this, Ext.apply(this.initialConfig, config));

        Application.DashBoardGrid.superclass.initComponent.apply(this, arguments);
    } // eo function initComponent

    ,onRender:function() {
        // this.store.load();

        Application.DashBoardGrid.superclass.onRender.apply(this, arguments);
    } // eo function onRender
});

Ext.reg('DashBoardGrid', Application.DashBoardGrid);

Json回复

{
    "countothercities": "0",
    "directreseller": "14",
    "totalresellersregisteredfor8cities": 33,
    "cityarray": [{
        "cityname": "bangalore",
        "totfollowup": "3",
        "totcallback": "4",
        "totnotintrested": "2",
        "totdealsclosed": "0",
        "totcallsreceived": "0",
        "totcallsentered": "68",
        "totresellerregistered": "6",
        "countiro": "109",
        "irotransferred": "83",
        "irodeferred": "26"
    }]
}

Answer 1

请显示您的JSON响应或服务器代码。这样我们才能更好地回答。

我对api的请求现在正在进行两次为什么？

显而易见的。内部Ext.onReady（）
您正在创建DashboardGrid的实例。致电1
您要求Ext通过传递xtype来创建DashboardGrid的实例。致电2

Answer 2

您正在创建网格两次。这样做。

Ext.onReady(function() {
    Ext.QuickTips.init();

    var win = new Ext.Window({
         items:{xtype:'DashBoardGrid'}
    });

    // code here

}); // eo function onReady

我的extjs网格没有在新架构中显示

2 个答案: