Jquery UI 选项卡与选项卡中的 Jquery UI 小部件表现得很奇怪
我的 Jquery UI 选项卡小部件中有三个选项卡。在选项卡内部,我正在创建一个 Wijmo 网格。每个选项卡上都有一个。 Grid 也基于 Jquery UI。第一个选项卡上的网格看起来不错。 第二个和第三个选项卡(隐藏的选项卡)上的网格有奇怪的尺寸问题。其中一个网格的宽度和高度大约为 10 像素。第三个选项卡上的显示大小约为 50 x 50 像素。
我知道这些选项卡上的代码很好,因为如果我将其中一个选项卡作为主选项卡,那么它就可以正常工作,而其他两个选项卡就会损坏。所以我认为这是 Jquery UI 选项卡小部件和选项卡内容(Wijmo 网格)之间的某种交互。有谁知道是什么导致了这种奇怪的相互作用以及我可以做些什么来使它按预期工作?
I have three tabs in a Jquery UI tabs widget. Inside of the tabs I am creating a Wijmo Grid. One on each tab. The Grid is based on Jquery UI as well. The grid on the first tab seems fine.
The grid on the second and third tabs (the hidden ones) have strange sizing issues. The Grid on one appears roughly 10 pixels wide and the full height. The one on the third tab appears about 50 by 50 pixels.
I know the code on those tabs is fine because if I make one of those the primary tab then it works fine and the other two are broken. So I think it is some sort of interaction between the Jquery UI Tabs widget and the contents of the tabs (a Wijmo Grid). Does anyone know what causes this strange interaction and what I can do to make it work predictably?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
Grid 在初始化时进行大小计算。这样做时需要以某种方式显示它。
您可以添加
class="ui-helper-hidden-accessible"
以使其在渲染时离开屏幕。确保先初始化网格,然后初始化小部件。或者,您可以在激活包含它的选项卡时调用
$("#grid").wijgrid("doRefresh");
。The Grid does size calculation when initializing. It needs to be displayed somehow when doing so.
You can add
class="ui-helper-hidden-accessible"
to make it off screen when rendering.Make sure you initialize the grids then the widgets. Or you can call
$("#grid").wijgrid("doRefresh");
when the tab is activated that it is contained in.