如何自定义dgrid中特定行的单元格？

我想提出一个网格，看起来像这样：我网格的列定义范围内的功能： Dgrid with custom header cells 如何自定义dgrid中特定行的单元格？

我通过定义renderHeaderCell实现上面的图片。

 // Customize header cells 
     this._columns.slice(1).forEach(
      function(column){ 
       column.renderHeaderCell = function(headerCellNode) { 

        // Add class to header cell 
        headerCellNode.classList.add("simbio-datasheet-header"); 

        // Create header labels 
        var headerLabelDiv = document.createElement("div"); 
        var headerTextNode = document.createTextNode(
          "label" in column ? column.label : column.field); 
        headerLabelDiv.appendChild(headerTextNode); 

        // Create header comboboxes 
        var comboBoxNode = put("div.combobox"), 
         us_states = ["CA", "MA", "OH", "FL"], 
         us_cities = ["Los Angeles", "Boston", "Columbus", "Miami"]; 
        var combobox1 = new SimBiologyComboBox({values: us_states}); 
        var combobox2 = new SimBiologyComboBox({values: us_cities}); 
        combobox1.placeAt(comboBoxNode); 
        combobox2.placeAt(comboBoxNode); 
        combobox1.startup(); 
        combobox2.startup(); 

        // Append everything to headerCellNode 
        headerCellNode.appendChild(headerLabelDiv); 
        headerCellNode.appendChild(comboBoxNode); 
       } 
      });

在该上下文中的列定义为：

this._columns = [ 
      { 
       field  : "Count", 
       label  : "", 
       width  : 25, 
       resizable : false 
      }, 
      { 
       field  : "A", 
       label  : "A", 
       width  : 75 
      }, 
      { 
       field  : "B", 
       label  : "B", 
       width  : 75, 
       sortable : false 
      }]

但是，我通过修改headerCells

实现这是没有一种方法可以修改非报头细胞（defaultCell）并获得相同的效果？

我不想修改特定列下的所有单元格，看起来像这样。只有一行的单元格。

（我试过在编辑器中混入到我的网格混合。但这种方法修改给定列的所有单元格...我无法弄清楚如何修改给定行的单元格）

来源

2016-03-08 cafed00d

有一个'renderCell'函数与每列相关联。但是无论你将要做什么，它都会适用于所有的行。因此，只需修改一行，就必须对所有列进行修改，并根据与特定单元格中出现的数据相关的某些条件进行修改。 – Himanshu

谢谢Himanshu！但是，我不知道如何在向商店添加数据时重新定义renderCell（）（Observable（.. Memory（...））我正在使用商店支持的网格，添加行数据项进入商店，它调用调用堆栈深处的insertRow（）方法（List.js），并在调用堆栈后调用renderCell（）... – cafed00d

请参阅：https：//gist.github.com/gamejunkie/ 4288890.在你的情况'renderCell'进入每个列的'this._columns'定义。 – Himanshu

你必须create a mixin类（作为所有的dgrid功能）并重写renderRow或renderCell，或者你传递一个格式化函数，它可以返回所有你喜欢的列的标记。

dgrid/dTuned中有一个demo，它显示了如何自定义渲染。

来源

2016-03-09 23:32:42 xamiro

如何自定义dgrid中特定行的单元格？

回答

相关问题