动态设置dojox.grid.datagrid标题列宽 [英] Set dojox.grid.datagrid header column width dynamically
问题描述
- 我有一个声明性的dojox.grid.datagrid,具有初始标题列宽。我有一个文本框。我的需要是
-
在UI中,如果用户向文本框输入任何值,则该值应设置为列标题的动态宽度。
- I have a declarative dojox.grid.datagrid with initial header column width. And i have a textbox. my need is
In UI, if user enters any value to textbox, that value should be set as the dynamic width of column's header.
<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">
我可以使用以下代码获取特定列的宽度。如何将此宽度设置为文本框值。
I am able to get the particular column's width using below code. How to set back this width to textbox value.
dojo.forEach(dijit.byId(tableID).layout.cells, function(cell,idx){
if(cell.field == id){
headerWidth = cell.width;
alert(headerWidth);
}
});
推荐答案
有一种方法叫做 setCellWidth()
(您可以在 API文档),您可以使用它来更改单元格的宽度。
There is a method called setCellWidth()
(you can read about it in the API Documentation) which you can use to change the width of the cells.
您需要完成的唯一步骤是更新列(以便更改变为可见)。这个步骤可以用 cell.view.update();
完成。
The only step you then need to complete is to update the column (so that the changes become visible). This step can be completed with cell.view.update();
.
注意:使用 grid.update()
或 grid.sizeChange()
更新完整的网格是不够的,因为它将只更新列标题。 (这是我注意到的)。
Be aware: updating the complete grid with grid.update()
or grid.sizeChange()
is not enough because it will only update the column headers. (That's something I noticed.)
所以在你的 forEach
循环中,你会做一些类似于:
So in your forEach
loop you would do something like:
grid.setCellWidth(idx, "200px");
cell.view.update();
我还制作了一个工作的JSFiddle,您可以查看这里。
I also made a working JSFiddle which you can view here.
这篇关于动态设置dojox.grid.datagrid标题列宽的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!