extjs：如何在列渲染器中使用 ajax 调用？

Posted 2023-02-26

【中文标题】extjs：如何在列渲染器中使用 ajax 调用？

【英文标题】：extjs: how to use ajax call in column renderer?

【发布时间】：2012-04-26 10:55:26

【问题描述】：

我现在得到的是：

renderer : function(value) 
    var ret;
    var conn = new Ext.data.Connection();
    conn.request(
        method : 'POST',
        url : rsdBackend,
        params : 
            get_object_by_id : 'true',
            rsd_type : record.data.references_table,
            object_id : value,
            uid : logged_user_id
        ,
        success : function(responseObject) 
            var data = Ext.decode(responseObject.responseText);
            ret = data[0].object_name;
        
    );
    return ret;

如果一列包含指向另一个数据的链接（数据库术语中的外键），我需要显示它引用的对象的名称。

所以，我能想到的最好方法是在渲染器中使用 ajax 调用。它有效，但问题是：我怎样才能返回响应？

上面的代码不起作用，因为ret是未定义的，我试图return它。

如何做到这一点，或者有更好的方法吗？

【参考方案1】：

基于此线程Sencha forum thread

我已经做了一个异步渲染器。

在我的示例中，我想在我的记录关联中显示第一条记录的“名称”值。

“fileRecord_store()”是我的关联存储的名称（通过“hasMany”关联模型创建）

在网格面板中，您可以制作这样的渲染器：

  header: 'Filename',  dataIndex: 'Files_id',      flex: 2,
    renderer: function(value, meta, record, rowIndex, colIndex, store, view) 
          var divId = 'my_cell_to_update_' + record.id;
          record.columnsNameUpdate(divId);
          return String.format("<div id='" + divId + "'>Loading...</div>"); 
                
,

现在我在模型类中添加了这个函数：

columnsNameUpdate : function(divId)

    this.fileRecord_store().on('load', this.updateColumn,this, divId : divId);
    this.fileRecord_store().load();
,

updateColumn : function(store, model, success, options)
    this.fileRecord_store().un('load', this.updateColumn,this);
    Ext.fly(options.divId).update(store.first().get('filename')); 

对我来说很好用！

【参考方案2】：

我不认为你可以这样做。 Ajax 调用是异步的，renderer() 函数是同步的。我现在无法想象如何将它们混合在一起。

在渲染网格之前，您需要获取 renderer() 函数（所有单元格！）所需的所有信息。为什么不能为它创建一个额外的商店，先加载它然后使用它？

【讨论】：

谢谢，我知道 a 用于异步 =) 我无法创建存储，因为我不知道我应该在那里保存什么类型的对象。我要么不能（我......不想真的）创建所有可能的商店，因为这个数字可能很大（没有上限）

然后创建一个 ActionColumn - 基本上将一个按钮添加到网格中，然后当用户单击该按钮时，您可以做任何您想做的事情。

或者您可以简单地在单元格中创建一个链接并订阅此链接的呈现事件，以便在呈现链接时调用您的函数 - 此时您进行 Ajax 调用并替换 HREF此链接的元素与其他内容...这实际上可能有效:) 但是在呈现链接但您没有此链接的最终目的地时，您仍然可能会遇到这种情况。