我在 TitlePane 中有一个 dojo Grid 小部件,它的宽度设置为 100%。
TitlePane 处于流动布局中,因此它的宽度随浏览器窗口大小而变化。我遇到的问题是,当父窗口扩展(或收缩)时,网格本身不会改变它的宽度。我可以通过在网格上调用 render() 来调整其自身大小,但是如何检测到父窗口已调整大小以便我知道重绘网格小部件?
我在 TitlePane 中有一个 dojo Grid 小部件,它的宽度设置为 100%。
TitlePane 处于流动布局中,因此它的宽度随浏览器窗口大小而变化。我遇到的问题是,当父窗口扩展(或收缩)时,网格本身不会改变它的宽度。我可以通过在网格上调用 render() 来调整其自身大小,但是如何检测到父窗口已调整大小以便我知道重绘网格小部件?
我有时不得不这样做;这不是太难:
function resizeGrid() {
// do whatever you need here, e.g.:
myGrid.resize();
myGrid.update();
}
dojo.addOnLoad(function() {
dojo.connect(window, "onresize", resizeGrid);
});
我有同样的问题。我尝试了类似于 Ryan Corradini 的解决方案。
只有第一次显示是可以的。如果我更改窗口大小,则正确调用 resize 函数,但网格的大小保持不变。
请注意我的特殊情况:在调整大小功能中,我必须设置网格的高度属性(仅调整大小+更新似乎不够)。
HTML 看起来像:
<div id="msgItems" dojoType="dijit.layout.ContentPane" region="center"
style="padding:2px;">
<form id="msgDefForm" name="msgDefForm" dojoType="dijit.form.Form">
<div style="display:none;"><input type="text" name="msgName" id="msgName" dojoType="dijit.form.TextBox"></input>
</div>
<table dojoType="dojox.grid.DataGrid" jsId="msgGrid" id="msgGrid"
rowsPerPage="10" rowSelector="5px" singleClickEdit="false" loadingMessage="Loading message content"
errorMessage="Error while loading the message content" selectable="true" >
<thead>
<tr>
<th field="zone" width="8em" cellType="dojox.grid.cells.Select" options="properties, values" editable="true">Zone</th>
<th field="property" width="auto" editable="true">Property</th>
<th field="value" width="auto" editable="true">Value</th>
</tr>
</thead>
</table>
</form>
</div>
JS看起来像:
... in startOnLoad :
dojo.connect( window, "onresize", msgGridResized);
msgGridResized ();
...
function msgGridResized () {
var cont = dojo.byId("msgItems")
var h = cont.clientHeight - 4;
if (h >= 0){
var grd = dijit.byId("msgGrid");
grd.attr("height", h+"px" );
grd.resize();
grd.update();
}
}
没有时间为您尝试,但您不能直接 dojo.connect 到 TitlePane 的调整大小事件并在处理程序中调整网格大小或使用声明/标记中的百分比设置网格大小吗?
您可以尝试使用以下代码:
grid.resize({ w: 400, h: 400 });
如果你想更通用一点:
var parentDiv = dom.byId('parentDiv');
grid.resize({ w: parentDiv.clientWidth, h: parentDiv.clientHeight });
参考:Dojo DataGrid height resize not working
希望它对你有用