如何将 html 元素放入 dojo dgrid table header

Question

我想在 dojo dgrid table 的 <th> 中放置一个超链接，但是当我尝试声明时这是不可能的

<thead>
    <tr>
       <th data-dgrid-column="{ field:'AVAILABLE_BALANCE',resizable:true}">Available
                                Balance<a href="#">click</a>
      </th>
    </tr>
</thead>

它显示为

Available Balance <a href="#">click</a>

怎么做

Answer 1

您可以使用专栏 renderHeaderCell 来实现这一点。

使用HTML网格方式

<thead>
  <tr>
    <th data-dgrid-column="{ field:'AVAILABLE_BALANCE',resizable:true, 
        renderHeaderCell:customRenderHeaderCell}">
    </th>
  </tr>
</thead>

JavaScript:

function customRenderHeaderCell(node){
    var div = document.createElement("div");
    div.innerHTML = "Available Balance<a href='#'>click</a>";
    return div;
}

使用编程方式

require([ 'dgrid/Grid' ], function (Grid) {
    var columns = {
        first: {
            label: "First Name"
        },
        last: {
            label: "Last Name"
        },
        balance: {
            field: 'AVAILABLE_BALANCE',
            resizable: true,
            renderHeaderCell: function(node){
               var div = document.createElement("div");
               div.innerHTML = "Available Balance<a href='#'>click</a>";
               return div;
           }
       }
    };
    var grid = new Grid({ columns: columns }, 'grid'); 
    grid.renderArray(arrayOfData);
});

如何将 html 元素放入 dojo dgrid table header

How to put an html element in dojo dgrid table header

dojo

dgrid