昨天晚上搞了一个很令讨厌的页面,一直加班到十点也没有把它美化,直到今天上午10点把它美化好,想起来,自己真是弱啊!
因为一开妈做需的也没有给我说清楚,这一页面上的操作项目的具体排列方式,我就按默认的横向进行排列了,完成后提交了,但他们不满意,非要按纵向排列,我本来页面搞的都不怎么滴,效率很低。这下倒好慢慢的折腾那个破页面了。
开始也没有仔细的去想想,只是在 ftl 文件中慢慢试怎么排列,开始的实现方式:
<#assign column=1>
<#assign keys = priorityMap?keys>
<#list keys as key>
<#if column%3=0><!--三列换行-->
<tr>
</#if>
<#if ....>
<#assign column=column+1>
<td>显示操作项</td>
</#if>
<#if column%3=0><!--三列换行-->
</tr>
</#if>
<#list>
以上的简单Freemarker 代码片段可以页面上的横项排列方式实现的,但需求又要求纵向排列;其实也很简单,但一开始怎么就没有他细想想#_#,实现方式如下:
先建table 里的一个行<tr>,再建好三个列<td> ,分别在三个<td> 中进行循环输出,代码如下:
<tr>
<td>
<#assign column=1>
<#assign keys = priorityMap?keys>
<#list keys as key>
<#if ....>
<#assign column=column+1>
<tr>
<td>
<table>具体的操作项</table>
</td>
</tr>
</#if>
<#list>
</td>
<td>
<#assign column=1>
<#assign keys = priorityMap?keys>
<#list keys as key>
<#if ....>
<#assign column=column+1>
<tr>
<td>
<table>具体的操作项</table>
</td>
</tr>
</#if>
<#list>
</td>
<td>
<#assign column=1>
<#assign keys = priorityMap?keys>
<#list keys as key>
<#if ....>
<#assign column=column+1>
<tr>
<td>
<table>具体的操作项</table>
</td>
</tr>
</#if>
<#list>
</td>
<tr>
终于把功能实现了,页面就这样,在慢慢地的尝试之下,终于调好!哎...