我有一个用ZK构建的页面。在此页面中,有一个开始搜索的按钮。如果有一些数据,它们将显示在网格视图中。每个数据都是以这种方式构建的:v 日期 1 (日/月/年) -项目 -项目 -项目v 日期 2 (日/月/年) -项目 -项目
Lecter V 表示箭头,但我无法发布图像,所以我使用具有类似图像的"v"来取消站立。
它工作正常,但存在问题。我会遇到这种情况:
日期 1 (日/月/年)
日期2 (日/月/年)
当我单击一个日期时,我希望箭头变为"v"并显示所有数据。如果在第一种情况下我单击日期,它变得接近。
如何更改网格项的默认视图?
这是我的代码
<grid id="demoGrid" width="50%" height="400px" style ="float:left"
model="@bind(vm.value)" emptyMessage="No data">
<columns menupopup="auto">
<column sort="auto(Hour)" label="Hour" width="150px"/>
<column sort="auto(Value)" label="Value(bpm)" hflex="1" />
</columns>
<!-- template for group -->
<template name="model:group">
<group label="@load(each)" />
</template>
<!-- template for each element in model -->
<template name="model" >
<row>
<label value="@load(each.hour)" />
<label value="@load(each.value)" />
</row>
</template>
<!-- template for footer -->
<template name="model:groupfoot">
<groupfoot>
<cell colspan="5" style="text-align: right; padding-right: 15px">
<label value="@load(each)" style="font-weight:bold;" />
</cell>
</groupfoot>
</template>
</grid>
我尝试在此子代码中使用标签详细信息:
<template name="model">
<details open="false">
<row>
<label value="@load(each.hour)" />
<label value="@load(each.value)" />
</row>
</details>
</template>
尝试这样的细节:
<template name="model">
<row>
<detail open="false">
<hlayout>
<label value="@load(each.hour)" />
<label value="@load(each.value)" />
</hlayout>
</detail>
<label value="second column"/>
</row>
</template>
解说:
- 细节只能有 1 个根元素,这就是我们设置
hlayout
的原因。
当然,您可以将其更改为div或任何您想要的内容。 row
标签必须位于详细信息标签之外。detail
采用一列,因此对于此示例,您需要提供 2 列。
编辑:
我创造了一个小提琴。