<stl:filter> 筛选标签

<stl:filter
    activeClassName="筛选链接选中状态class名称"
    onBeforeSend="动态请求发送前执行的JS代码"
    onSuccess="动态请求成功后执行的JS代码"
    onComplete="动态请求结束后执行的JS代码"
    onError="动态请求失败后执行的JS代码">
</stl:filter>

说明

通过 <stl:filter> 实现前台页面筛选功能。

<stl:filter> 标签内中可以包含任何 STL 标签或 HTML 标签，通常包含 <stl:contents> 或者 <stl:pageContents> 内容列表标签，用于显示筛选内容列表。

<stl:filter> 标签内需要包含Id为对应筛选项名称的元素，例如：

<a href="javascript:;" id="筛选项">筛选项</a>

其中id与指定的筛选项需要一一对应。

如果希望显示特定筛选分类的全部结果，可以添加包含Id为对应筛选分类名称的元素，例如：

<a href="javascript:;" id="筛选分类">筛选分类</a>

其中id与指定的筛选分类需要一一对应，点击此链接后将清除指定的筛选。

子标签

子标签	说明
stl:contents	内容列表
stl:pageContents	翻页内容列表
stl:pageItems	翻页项

示例

显示筛选项及筛选结果

下面的例子获取整站内容以及筛选项，点击筛选项将显示特定筛选内容列表。

<style>
  .active {color: red}
</style>

<stl:filter activeClassName="active">

		<table>
			<tr>
				<td>单选</td>
				<td>
					<a href="javascript:;" id="单选">全部</a>
					<a href="javascript:;" id="单选1">单选1</a>
					<a href="javascript:;" id="单选2">单选2</a>
				</td>
			</tr>
			<tr>
				<td>多选</td>
				<td>
					<a href="javascript:;" id="多选">全部</a>
					<a href="javascript:;" id="多选1">多选1</a>
					<a href="javascript:;" id="多选2">多选2</a>
					<a href="javascript:;" id="多选3">多选3</a>
				</td>
			</tr>
		</table>

		<ul>
			<stl:pageContents channelIndex="首页" pageNum="20" scope="all" order="AddDate">
				<li>
					<stl:a target="_blank"></stl:a>
				</li>
			</stl:pageContents>
		</ul>

		<div>
			<stl:pageItems>
				<a href="{PageItem.FirstPage}">首页</a>
				<a href="{PageItem.PreviousPage}">上一页</a>
				<stl:pageItem type="PageNavigation">
					<stl:yes>
						<a href="{Current.Url}">{Current.Num}</a>
					</stl:yes>
					<stl:no>
						<a class="on" style="color:#F00">{Current.Num}</a>
					</stl:no>
				</stl:pageItem>
				<a href="{PageItem.NextPage}">下一页</a>
				<a href="{PageItem.LastPage}">末页</a>
			</stl:pageItems>
		</div>

	</stl:filter>