我有一个zul包含一个列表框,我想冻结它的第一列,我使用冻结函数使其冻结。
<frozen columns="1" />
但问题是当我尝试滚动它时,应该冻结的列正在移动到列表框的中间,这看起来并不酷。
see the 1st column is in the middle of the listbox
这是我的祖尔
<window id="RelationshipResource" border="normal" width="750px" title="List Detail"
closable="true" apply="${arg.controller}">
<style dynamic="true">
tr.z-row td.z-row-inner { border-right: 3px #CCC; }
</style>
<scrollview hflex="1" vflex="1">
<div id="appMain" align="center" height="460px" width="99%" style="margin:5px;">
<div class="centerApp" height="250px" width="99%">
<grid>
<columns >
<column label="" width="150px"/>
<column label=""/>
</columns>
<rows >
<row style="background-color:#FFFFFF">
<label value="Open New Relationship"/>
<textbox id="txtOpenNewRelationship" width="200px" />
</row>
<row style="background-color:#FFFFFF">
<label value="Item Code" />
<textbox id="txtItemCode" width="200px" />
</row>
<row style="background-color:#FFFFFF">
<label value="Item Description" />
<textbox id="txtItemDescription" width="400px" />
</row>
<row style="background-color:#FFFFFF">
<label value="Relationship line" />
<textbox id="txtRelationshipLine" width="100px" />
</row>
</rows>
</grid>
<div class="myTable" height="110%" >
<listbox id="listboxSRN" vflex="1" mold="paging" pageSize="5" pagingPosition="top">
<frozen columns="1" />
<listhead sizable="true">
<listheader label="1st col" width="240px"/>
<listheader label="2nd col" width="240px" />
<listheader label="3rd col" width="230px"/>
<listheader label="4th col" width="230px"/>
<listheader label="5th col" width="230px"/>
<listheader label="6th col" width="230px"/>
</listhead>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listfoot style="margin:0px">
<listfooter></listfooter>
<listfooter align="right">TOTAL</listfooter>
<listfooter >
<textbox hflex="1" id="txtTotal"/>
</listfooter>
</listfoot>
</listbox>
</div>
<groupbox id="gb" mold="3d" style="vertical-align:middle;background-color:#FAFAFA;margin-top:2px">
<button id="btnClose" label="Close" image="/img/Logout24.png" height="40px" width="150px"/>
</groupbox>
<!--<label value="You are using ZK version: ${desktop.webApp.version}"/>-->
</div>
</div>
</scrollview>
</window>
如何让第一列粘在列表框的左侧?因此,当我滚动它时,另一列会移动或丢失,但我的第一列保持原样。
即时通讯使用zk 6.5.5,你能否请你不要投票给我,我喜欢我的声誉,所以如果有什么遗失或者你需要更多信息请告诉我谢谢你
答案 0 :(得分:0)
感谢Malte Hartwig,我找到了解决方案,因为我的div与id appmain有对齐=&#34; center&#34;,它对列表框的影响很大,使列在滚动时居中到最后。
解决方案是添加align =&#34; left&#34;属于我的包含列表框的div,因此列表框本身并不受来自上部div的center属性的影响。
这是代码
<window id="RelationshipResource" border="normal" width="750px" title="List Detail"
closable="true" apply="${arg.controller}">
<scrollview hflex="1" vflex="1">
<!-- this is the culprit that make my column moving to the center -->
<div id="appMain" align="center" height="460px" width="99%" style="margin:5px;">
<div class="centerApp" height="250px" width="99%">
<grid>
<columns >
<column label="" width="150px"/>
<column label=""/>
</columns>
<rows >
<row style="background-color:#FFFFFF">
<label value="Open New Relationship"/>
<textbox id="txtOpenNewRelationship" width="200px" />
</row>
<row style="background-color:#FFFFFF">
<label value="Item Code" />
<textbox id="txtItemCode" width="200px" />
</row>
<row style="background-color:#FFFFFF">
<label value="Item Description" />
<textbox id="txtItemDescription" width="400px" />
</row>
<row style="background-color:#FFFFFF">
<label value="Relationship line" />
<textbox id="txtRelationshipLine" width="100px" />
</row>
</rows>
</grid>
<!-- here we add align left to make the column not moving -->
<div class="myTable" align="left" height="110%" >
<listbox id="listboxSRN" vflex="1" mold="paging" pageSize="5" pagingPosition="top">
<frozen columns="1" />
<listhead sizable="true">
<listheader label="1st col" width="240px"/>
<listheader label="2nd col" width="240px" />
<listheader label="3rd col" width="230px"/>
<listheader label="4th col" width="230px"/>
<listheader label="5th col" width="230px"/>
<listheader label="6th col" width="230px"/>
</listhead>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listitem >
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
<listcell label="siTamvan" />
</listitem>
<listfoot style="margin:0px">
<listfooter></listfooter>
<listfooter align="right">TOTAL</listfooter>
<listfooter >
<textbox hflex="1" id="txtTotal"/>
</listfooter>
</listfoot>
</listbox>
</div>
<groupbox id="gb" mold="3d" style="vertical-align:middle;background-color:#FAFAFA;margin-top:2px">
<button id="btnClose" label="Close" image="/img/Logout24.png" height="40px" width="150px"/>
</groupbox>
<!--<label value="You are using ZK version: ${desktop.webApp.version}"/>-->
</div>
</div>
</scrollview>
可能是因为我希望分页仍然在中间,就像我必须从列表框中分离da分页,但我不认为我需要它。
再次感谢您的提示