anyline JSP标签

al:checkbox实现多选框

<div class="al-chk-item-border">
<input type="checkbox" value="1" id="lvl_1" checked="checked" name="lvl"/><label for="lvl_1" class="al-chk-item-label">高级</label>
</div>
<div class="al-chk-item-border">
<input type="checkbox" value="2" id="lvl_2" checked="checked" name="lvl"/><label for="lvl_2" class="al-chk-item-label">中级</label>
</div>
<div class="al-chk-item-border">
<input type="checkbox" value="3" id="lvl_3" name="lvl"/><label for="lvl_3" class="al-chk-item-label">初级</label>
</div>

标签实现:

<al:checkbox data="{1:高级,2:中级,3:初级}" name="lvl" value="1"></al:checkbox>默认选中1
<al:checkbox data="{1:高级,2:中级,3:初级}" name="lvl" value="1,2"></al:checkbox>默认选中1，2

al:checkbox实现开关复选框

<input type="checkbox" id="chk_fn" name="fn" value="1" /><label for="chk_fn">是否开放</label>

标签实现:

<al:checkbox data="{1:是否开放}" name="fn" id="chk"></al:checkbox>
<al:checkbox data="{1:是否开放}" name="fn"></al:checkbox>如果不设置id则会根据name和value生成id="fn_1"
<al:checkbox data="{1:是否开放}" name="fn" id="chk" value="1"></al:checkbox>如果设置value="1"(与data中的值一致),则生成的checkbox默认选中

关于al:date中的nvl与dev

value与body为空的情况下

如果nvl=true则显示当前日期，如果nvl=false则不输出

如果nvl=其他值，则直接输出nvl

如果没有指定value,body,nvl都为空，同时def有值，则输入def

需要注意的是def与nvl=true时，日期都会参与格式化与运算(如增加一天)，而nvl=其他值时，直接原样输出evl并不执行格式化与其他运算

关于al:number中的def与evl

def是指如果没有输入值，则取默认值，默认值同样会执行格式化与其他运算

evl/nvl是指如果结果为empt(null),则直接输出evl/nvl，不会执行格式化,不会执行运算

关于分页后退保持页数

有一种典型的场景AJAX分页，
用户第一次打开列表页时默认显示第1页。

用户在列表页中切换到第2页后，在第2页中打开一个条目的明细。操作完明细后退。返回到到列表
这时列表页需要直接显示第2页数据。
如何区分是后退过来的还是页面刷新过来的。navi是在列表页中存放了一个隐藏的input在切换页数后修改这个input
刷新过来的页面这个input值为空，而后退过来的这个input值为2
根据浏览器加载机制，在页面加载完成之后才会给input赋值。所以在页面加载过程中取不到这个input值。
可以把需要取input值的代码放在setTimeout(function(){取值},0);

al:checkbox设置data-*属性

set.add(DataRow.parseJson("{''ID'':''1'',''CODE'':''01'',''NM'':''高级'',''TITLE'':''高级工工程师'',''LVL'':''A''}"));
set.add(DataRow.parseJson("{''ID'':''2'',''CODE'':''02'',''NM'':''中级'',''TITLE'':''中级工工程师'',''LVL'':''B''}"));
set.add(DataRow.parseJson("{''ID'':''3'',''CODE'':''03'',''NM'':''初级'',''TITLE'':''初级工工程师'',''LVL'':''C''}"));

通过itemExtra设置data-*

 <al:checkbox data="${set}" border="true" itemExtra="id:ID,code:CODE"/>

根据ID值生成data-id值,执行结果

<input type="checkbox" value="1" id="chk_1" name="chk"data-id="1"data-code="01"/><label for="chk_1" class="">高级</label>
<input type="checkbox" value="2" id="chk_2" name="chk"data-id="2"data-code="02"/><label for="chk_2" class="">中级</label>
<input type="checkbox" value="3" id="chk_3" name="chk"data-id="3"data-code="03"/><label for="chk_3" class="">初级</label>

如果直接指定data-*的值，则通过extra属性

<al:checkbox data="${set}" border="false" extra="id:1,code:2" name="chk"/>

执行结果

<input type="checkbox" value="1" id="chk_1" name="chk" data-id="1" data-code="2"/><label for="chk_1" class="al-chk-item-label">高级</label>
<input type="checkbox" value="2" id="chk_2" name="chk" data-id="1" data-code="2"/><label for="chk_2" class="al-chk-item-label">中级</label>
<input type="checkbox" value="3" id="chk_3" name="chk" data-id="1" data-code="2"/><label for="chk_3" class="al-chk-item-label">初级</label>

al:checkbox自定义样式

默认情况下生成的标签在最外层有div包围，如果是多选框则每个条目外也有div包围

可以通过clazz="item"设置每个条目外层div的class，通过borderClazz="border"设置最外层div的class

如果不需要外层div可以通过border="false"取消

al:checkbox生成临时选项

在根据集合数据源生成多选框时，经常需要生成一个数据源中没有的默认项，

如数据源中只有高级、中级、初级三个选项，但收集数据时需要一个待定，这时需要在生成标签时指定一个默认项

 <al:checkbox data="${set }" head="默认" name="lvl"></al:checkbox>

如果需要设置选中项，首先要给这一项设置value值也就是生成的input的value值，再通过标签的value属性设置默认选中项

 <al:checkbox data="${set }" head="默认" headValue="0" name="lvl" value="0"></al:checkbox>

当headValue与value中至少一个值相等时，当前项默认选中

al:checkbox根据集合数据源确定默认选中项

根据集合数据源确认默认选中项时，默认情况下会取集合中条目的ID值，选项中的value值在数据源中出现时则选中当前项
但数据源经常是从数据库中查询出来的，列中并不一定有ID，也有可能是CD
这时需要显式指定根据哪一列或哪一个属性的值来确认默认选中项

<al:checkbox data="${set }" valueKey="CODE" textKey="TITLE"  value="${values}" rely="CD"/>

当set条目中的CODE值与values条目中的CD值有至少一项相等时,则选中当前项

set:用来生成复选框的数据源

value:用来确证默认选中项的数据源

al:checkbox 自定义value key与text key 

根据集合数据源生成checkbox时，默认情况下会取集合中条目的ID值作为input的value值，取条目的NM值作为label的标签体

但数据源经常是从数据库中查询出来的，列中并不一定有ID和NM，也有可能是CODE,TITLE或其他情况

这时需要显式指定value key与text key

<al:checkbox data="${set }" valueKey="CODE" textKey="TITLE" />

al:checkbox根据集合数据源实现多选框 

<div class="al-chk-item-border">
<input type="checkbox" value="1" id="lvl_1" checked="checked" name="lvl"/><label for="lvl_1" class="al-chk-item-label">高级</label>
</div>
<div class="al-chk-item-border">
<input type="checkbox" value="2" id="lvl_2" checked="checked" name="lvl"/><label for="lvl_2" class="al-chk-item-label">中级</label>
</div>
<div class="al-chk-item-border">
<input type="checkbox" value="3" id="lvl_3" name="lvl"/><label for="lvl_3" class="al-chk-item-label">初级</label>
</div>

标签实现:、

DataSet set = new DataSet();

set.add(DataRow.parseJson("{''ID'':''1'',''NM'':''高级''}"));
set.add(DataRow.parseJson("{''ID'':''2'',''NM'':''中级''}"));
set.add(DataRow.parseJson("{''ID'':''3'',''NM'':''初级''}"));

DataSet values = new DataSet();
values.add(DataRow.parseJson("{''ID'':''1''}"));
values.add(DataRow.parseJson("{''ID'':''2''}"));

<al:checkbox data="${set }" name="lvl" value="${values }"></al:checkbox>

这里将根据values中的条目的ID来确定默认选中项

al:checkbox自定义选中条件 

通过集合数据源生成checkbox时，有时需要根据某一列表值设置默认选中

如所有级别为A的条目默认选中

DataSet set = new DataSet();

set.add(DataRow.parseJson("{''ID'':''1'',''CODE'':''01'',''NM'':''高级'',''TITLE'':''高级工工程师'',''LVL'':''A''}"));

set.add(DataRow.parseJson("{''ID'':''2'',''CODE'':''02'',''NM'':''中级'',''TITLE'':''中级工工程师'',''LVL'':''B''}"));

set.add(DataRow.parseJson("{''ID'':''3'',''CODE'':''03'',''NM'':''初级'',''TITLE'':''初级工工程师'',''LVL'':''C''}"));

<al:checkbox data="${set}" name="chk" checkedValue="A"/>

条目中ID=A时，当前项选中

<al:checkbox data="${set}" name="chk" checkedValue="A" rely="LVL"/>

注意:生成input.value时还是取ID列的值,rely只是在判断选中条件时使用,如果不指定rely则根据ID=A判断是否选中

al:text 

java:

String key ="NM";
DataRow row = new DataRow();
row.put(key,"张三");
DataSet set = new DataSet();
set.add(row);

jsp:

<al:text data="${row}" property="NM"/>

取row中的NM列的值

等同于${row.NM}

在实现开发过程中，NM经常需要动态值,此时才需要text标签

<al:text data="${row}" property="${key}"/>

按下标取值

<al:text data="${set}" index="0" property="${key}"/>

分页查询之AJAX分页 

AJAX分页一般需要

1.结构页面

2.数据页面

每个页面一般对应后台的Controller为其提供必要数据

大体流程一般是

1.访问结构controller 

2.结构controler打到对应的结构页面

3.结构页面发起ajax请求到数据controller

4.数据controller查询数据并调用数据页面生成html结构返回到浏览器

5.结构页接收到html添加到当前页面中

实现方式：

在结构页面中添加分页标签<al:navi page="分页下标显示位置"  body="生成的HTML结构显示位置" url="数据controller对应的url"/>

navi标签有多个属性可以设置

type:0按下标分页(默认) 1:只在底部显示“加载下一页”(内容通过guide设置)

param:提供查询参数的函数，以json格式返回

creater:方式ajax或html

intime:页面加载完成后是否立即执行

refresh:生成刷新当前页的函数

before:加载数据前执行

after:加载数据后执行

function:标签执行完后会生成一个函数，可以调用当前方法相当于重新查询第一页数据

auto:浏览器滚动到底部时是否自动加载下一页数据，一般移动浏览器使用

jump:是否显示跳转到第几页

guide:加载下一页的文本

empty:查询无内容时提示

over:到达最后一页的提示

stat:是否显示统计(统计格式在配置文件中设置)

style:对应分页配置文件中的key

为什么需要数据页面？

JSP遍历标签中按下标取值

在<c:forEach>中经常需要取上一条或下一条的数据，但jstl中并没有提供相应的标签，可以通过<al:text>来实现

<c:forEach var="item" items="${set}" varStatus="status">

    当前行姓名:${item.NM}

    上一行姓名:<al:text data="${set}" properyt="NN" index="${status.index-1}"></al:text>

</c:forEach>

JSP标签中动态属性 

静态属性一般通过EL表达式就可以实现

如${user.NM}

而实际开发过程中NM属性经过是动态值，此时可以通过<al:text>标签实现

如:<al:text data="${user}" property="${key}"/>

运行时取值表达式

 select等标签中textKey与textValue属性，用来生成option标签的value值和标签体

如textValue="NM",生成标签体时会调用集合中条目的getNm(),getString("NM")等方法。

如果需要提取多列值可以通过textValue="{列名/属性名}"的形式实现

如textValue="{ID}-{NM}"  text="标题{TITLE}"

DataSet set = new DataSet();

set.add(DataRow.parseJson("{''ID'':''1'',''CODE'':''01'',''NM'':''高级'',''TITLE'':''高级'',''LVL'':''A''}"));set.add(DataRow.parseJson("{''ID'':''2'',''CODE'':''02'',''NM'':''中级'',''TITLE'':''中级'',''LVL'':''B''}"));set.add(DataRow.parseJson("{''ID'':''3'',''CODE'':''03'',''NM'':''初级'',''TITLE'':''初级'',''LVL'':''C''}"));<al:checkbox data="${set}" textKey="TITLE"/>

<select>

    <option value="1">高级</option>

    <option value="2">中级</option>

    <option value="3">初级</option>

</select>

<al:checkbox data="${set}" textKey="{CODE}-{TITLE}"/>

<select>

    <option value="1">01-高级</option>

    <option value="2">02-中级</option>

    <option value="3">03-初级</option>

</select>

<al:checkbox data="${set}" textKey="CODE:{CODE} 标题:{TITLE}"/>

<select>

    <option value="1">CODE:01 标题:高级</option>

    <option value="2">CODE:02 标题:中级</option>

    <option value="3">CODE:03 标题:初级</option>

</select>

des:value 

des:key

al:unescape 

al:delay 

al:text 

<al:text></al:text>

al:sum 

al:substring 

al:strip 

al:serial 

weixin:check 

al:select 

des:param 

des:url 

des:as 

des:input 

des:textarea 

seo:head 

seo:keywords 

aliyun:oss 

weixin:auth 

weixin:config 

weixin:pay 

al:evl 

al:ajax 

al:base 

al:checkbox 

用来生成<input id="op" type="checkbox" value="1"/><label>是否开放</label>标签

al:config 

al:contains 

al:date 

al:division 

al:ellipsis 

al:else 

al:escape 

al:replace 

al:if 

al:message 

al:minute 

al:money 

al:navi 

用来实现jsp或ajax方式分页

url         ;//数据来源
param           ;//参数收集函数
container       ;//返回内容显示容器
body            ;//返回内容显示容器class或id(如果body与page分开)
cur         ;//当前页
page            ;//返回内容显示容器class或id(如果body与page分开)
bodyContainer       ;//如果body与page分开(兼容上一版本)
naviContainer       ;//如果body与page分开(兼容上一版本)
creater = "ajax"    ;//分页方式 ajax | html
scroll          ;//自动翻页时 监听的滚动事件源 默认window
method = "post"     ;
id          ;//一个页面内多个标签时需要id区分
function        ;//指定function后,需主动调用function后加载数据,查询条件发生变化时可调用function
refresh         ;//刷新当前页的函数
before          ;//渲染之前调用
after           ;//渲染之后调用
intime = false      ;//实时执行
auto = null     ;//是否加载下一页内容(swap加载更多typ=1时 划屏到底部自动加载)
callback        ;//回调函数
guide           ;//加载更多文本提示
empty           ;//查询无数据显示内容
over            ;//最后一页提示
style = "default"   ;//样式标记对应anyline-navi.xml中的config.key
stat = false        ;//是否显示统计
jump = false        ;//是否显示跳转
vol = true      ;//是否显示每页多少条(配置文件开启的情况下有效)
delay = 0       ;//延迟执行时间

al:number 

al:nvl 

al:omit 

al:param 

al:radio 

al:random 

des:a

这个标签用一般来加密url参数

原文:<a href="/a.html?id=1">连接</a>

<des:a href="/a.html?id=1">连接</des:a>生成密文<a href="/a.html?id=密文">连接</a>