【问题标题】:Set dojox.grid.datagrid header column width dynamically动态设置 dojox.grid.datagrid 标题列宽
【发布时间】:2013-03-27 10:19:48
【问题描述】:
  • 我有一个带有初始标题列宽度的声明性 dojox.grid.datagrid。我有一个文本框。我的需要是
  • 在 UI 中,如果用户在文本框中输入任何值,该值应设置为列标题的动态宽度。

    <div class="claro" id="dfgdfgd" name="dataGrid" onclick="setWidgetproperty(this.id,'xy','inner__dfgdfgd');" ondblclick="editCustomGrid(this.id)" onmouseup="setDocStyle(this.id)" style="height:200px; left:42px; position:absolute; top:89px; width:950px;">
     <table class="claro" dojotype="dojox.grid.DataGrid" id="inner__dfgdfgd" rowselector="10px" style="height: 180px; width: 300px;">
          <thead>
               <tr>
                    <th field="Column1" id="Column1" noresize="true" width="100px">
                         <label id="Column1" onclick="getCustomGridColName(this.id,'inner__dfgdfgd');" style="cursor:pointer; font-family: Times; font-size:12pt;">
                              Column1
                         </label>
                    </th>
                    <th field="Column2" id="Column2" noresize="true" width="100px">
                         <label id="Column2" onclick="getCustomGridColName(this.id,'inner__dfgdfgd');" style="cursor:pointer; font-family: Times; font-size:12pt;">
                              Column2
                         </label>
                    </th>
               </tr>
          </thead>
     </table>
     <input id="hidden__dfgdfgd" name="dataGrid" style="display:none;" type="hidden">
    

我可以使用以下代码获取特定列的宽度。如何将此宽度设置回文本框值。

dojo.forEach(dijit.byId(tableID).layout.cells, function(cell,idx){
                if(cell.field == id){
                    headerWidth = cell.width;
                    alert(headerWidth);
                }
            });

【问题讨论】:

    标签: javascript dynamic datagrid dojo dojox.grid.datagrid


    【解决方案1】:

    有一种方法称为setCellWidth()(您可以在API Documentation 中了解它),您可以使用它来更改单元格的宽度。

    您需要完成的唯一步骤是更新列(以便更改可见)。这一步可以通过cell.view.update();完成。

    注意:用grid.update()grid.sizeChange() 更新整个网格是不够的,因为它只会更新列标题。 (这是我注意到的。)

    因此,在您的 forEach 循环中,您会执行以下操作:

    grid.setCellWidth(idx, "200px");
    cell.view.update();
    

    我还制作了一个可用的 JSFiddle,您可以查看 here

    【讨论】:

    • 是否可以使用 onResizeColumn(cellIdx) 事件重新调整列的宽度
    • 我不明白为什么不这样做。您可以在事件处理程序中编写相同的 foreach 循环。
    • 好的。触发事件时,是否可以获得调整后的宽度值?
    • 您可以在事件处理程序中使用grid.getCell(celldx).width 来获取在事件处理程序中作为参数给出的单元格的宽度。您可以使用该单元格的宽度,而不是将其设置为“200px”。
    • 尝试使用grid.getCell(celldx).unitWidth。每次更改列宽(以编程方式或通过 UI)时,该值都会更新。
    猜你喜欢
    • 2013-06-29
    • 2013-03-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-01-30
    • 2014-06-04
    • 2011-05-08
    • 2012-04-01
    相关资源
    最近更新 更多