我正在使用这篇架构文章http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/
在我的一类Dashboardgrid中，我有两个函数：
,linkRenderer : function (data, cell, record, rowIndex, columnIndex, store) {
if (data != null) {
return '<a href="javascript:void(0)" onclick="this.resellerwindow(\'' +record.data.cityname+'\')">'+ data +'</a>';
}
return data;
},
resellerwindow : function (cityname) {
// render the grid to the specified div in the page
// resellergrid.render();
resellerstore.load();
wingrid.show(this);
}
当调用linkrendrer函数的click事件时，它会给出错误
this.resellerwindow is not a function
我应该在哪里以及如何设置resellerwindow功能？
我的ResellerDashBoard类
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 : this.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 :[]
,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
/**
* It is the renderer of the links of cell
* @param data value of cell
* @param record object of data has all the data of store and record.id is unique
**/
,linkRenderer : function (data, cell, record, rowIndex, columnIndex, store) {
if (data != null) {
return '<a href="javascript:void(0)" onclick="DashBoardGrid.resellerwindow(\'' +record.data.cityname+'\')">'+ data +'</a>';
}
return data;
},
resellerwindow : function (cityname) {
// render the grid to the specified div in the page
// resellergrid.render();
resellerstore.load();
wingrid.show(this);
}
,onRender:function() {
// this.store.load();
Application.DashBoardGrid.superclass.onRender.apply(this, arguments);
} // eo function onRender
});
Ext.reg('DashBoardGrid', Application.DashBoardGrid);
答案 0 :(得分：0)
当您的<a>标记中的函数被调用时，您的范围会混乱，这不会指向您定义函数的对象，而是指向<a> - dom节点。
很难从html片段中调用成员函数，就像网格渲染器返回的片段一样。我建议你看看Ext.grid.ActionColumn来解决这个问题。当您查看此列类型中的代码时，您应该能够编写自己的列类型来呈现链接而不是像ActionColumn这样的图标。
另一种选择是使用我的Ext.ux.grid.ButtonColumn，它不会渲染链接，而是使用网格中的按钮。
有关ExtJS范围的更多信息（以及一般的js）：http://www.sencha.com/learn/Tutorial:What_is_that_Scope_all_about
答案 1 :(得分：0)
this.resellerwindow is not a function
因为'this'，在onclick函数中实际上是对'a'dom元素的引用;
为了从onclick处理程序访问'resellerwindow'函数，您需要从执行处理程序的全局作用域访问该函数：
var globalObj =
{
linkRenderer : function (data, cell, record, rowIndex, columnIndex, store)
{
if (data != null)
return '<a href="javascript:void(0)" onclick="globalObj.resellerwindow(\'' +record.data.cityname+'\')">'+ data +'</a>';
return data;
},
resellerwindow : function (cityname)
{
// render the grid to the specified div in the page
// resellergrid.render();
resellerstore.load();
wingrid.show(this);
}
}
所以使用globalObj.resellerwindow（......）;
答案 2 :(得分：0)
问题是这并没有指向类本身。如果您需要将a元素呈现为字符串而不是JavaScript对象，则需要调用一个全局函数来调用resellerwindow函数（在获得正确的引用之后）。但是，我认为更有效的方法是放弃字符串并使用JavaScript对象。然后你可以做类似以下的事情：
var a = document.createElement("a");
a.onclick = this.resselerwindow;
如果您使用jQuery，可以使用以下内容：
return $("<a />").click(this.resselerwindow)[0];
答案 3 :(得分：0)
而不是构建和传递直接html，请尝试这些。
{tag：'a'， href：'＃'， html：'点击我'， onclick：this.resellerWindow}
确保linkRenderer中的范围是网格，通过该列定义中的设置'scope：this'。因此this.resellerWindow引用了网格的功能。
尝试返回创建的对象。