extJs livesearchpanel用于extJs门户内的数据网格

时间:2012-05-09 12:00:56

标签: javascript extjs extjs-mvc

我正在研究Extjs门户示例并从extjs4-mvc-portal on GitHub下载了示例。

我已经成功地在Eclipse中集成了Tomcat并添加了XML网格面板。我想添加一个“livesearchpanel”similar to this Live Search Grid Example

这个例子分为不同的部分,比如store,portlet,我很困惑在哪里添加CSS文件和JavaScript文件来集成livesearchpanel。

当我在portlet部分添加时发生以下错误

  

无法加载资源:服务器响应状态为404(未找到)

Ext.define('ExtMVC.view.portlet.livegrid', {
    extend: 'Ext.ux.LiveSearchGridPanel',
    alias: 'widget.livegrid',

height: 300,

/**
 * Custom function used for column renderer
 * @param {Object} val
 */
change: function(val) {
    if (val > 0) {
        return '<span style="color:green;">' + val + '</span>';
    } else if (val < 0) {
        return '<span style="color:red;">' + val + '</span>';
    }
    return val;
},

/**
 * Custom function used for column renderer
 * @param {Object} val
 */
pctChange: function(val) {
    if (val > 0) {
        return '<span style="color:green;">' + val + '%</span>';
    } else if (val < 0) {
        return '<span style="color:red;">' + val + '%</span>';
    }
    return val;
},

initComponent: function(){

    var store = Ext.create('ExtMVC.store.lives');

    Ext.apply(this, {
        height: this.height,
        store: store,
        stripeRows: true,
        columnLines: true,
        columns: [{
            text     : 'Company',
            flex     : 1,
            sortable : false, 
            dataIndex: 'company'
        },
        {
            text     : 'Price', 
            width    : 75, 
            sortable : true, 
            renderer : 'usMoney', 
            dataIndex: 'price'
        },
        {
            text     : 'Change', 
            width    : 75, 
            sortable : true, 
            dataIndex: 'change',
           // renderer: change
        },
        {
            text     : '% Change', 
            width    : 75, 
            sortable : true, 
            dataIndex: 'pctChange',
            //renderer: pctChange
        },
        {
            xtype    : 'datecolumn',
            text     : 'Last Updated', 
            width    : 85, 
            sortable : true, 
            dataIndex: 'lastChange'
        }]
    });

    this.callParent(arguments);
  }
});

我在extjs / src / grid /的src部分尝试过EXT.ux.LiveSearchGridPanel.js,更改extend: 'Ext.grid.LiveSearchGridPanel',也``extend:'Ext.grid.Ext.ux.LiveSearchGridPanel',

1 个答案:

答案 0 :(得分:0)

好的问题解决了.......... 我只是将ux文件夹放入extjs / src。

感谢