如何调用此的onclick javascript函数在我的建筑

Question

我使用这篇文章架构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的单击事件函数被称为它给出错误

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); 

Answer 1

你的范围搞砸了，当你<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

Answer 2

this.resellerwindow is not a function 

因为 '这个'，在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（ ......）;

Answer 3

问题是这并不指向类本身。如果您需要将一个元素呈现为一个字符串而不是JavaScript对象，则需要调用一个全局函数来调用resellerwindow函数（获得正确的引用之后）。但是，我相信一个更有效的方法是放弃字符串并使用JavaScript对象。如果你使用jQuery像下面这样可以用来

var a = document.createElement("a"); 
    a.onclick = this.resselerwindow; 

：

return $("<a />").click(this.resselerwindow)[0]; 

Answer 4

，而不是建设和传球直接HTML，尝试这些，那么你可以这样做以下。

1. 创建锚对象

{标签： 'A'， 的href： '＃'， HTML： '按我'， 的onclick：此。resellerWindow}

1. 确保，范围，linkRenderer是网格，通过设置 '范围：本' 在列定义。这样this.resellerWindow引用了网格的函数。

2. 尝试返回创建的对象。