在Domino中应用TableSorter

最新推荐文章于 2024-10-16 16:26:58 发布

cuinaozun7188

最新推荐文章于 2024-10-16 16:26:58 发布

阅读量109

点赞数

文章标签： javascript ViewUI

在Domino 中应用TableSorter 大家知道，Domino 中的视图应用到Web 上，有多种展示方式，一种是用Applet 方式，一种是默认方式展示，还有一种就是方式就是“将视图内容作为HTML ”。严格说这只是视图的一个选择项，但今天我们就是要用到这种方式。
这种方式有什么好处那？它的好处就是，需要开发人员自己动手在各列值之间添加HTML 标记。当然，你也可以不加，那么在浏览器中将是一团乱糟糟的内容展现在你的面前。因为本文中的视图就是要自己添加HTML 标记，那么就在下面简单说一下步骤。

新建一个视图，视图属性的高级中，选中“将视图内容作为HTML ”，然后视图的第一列要加上“ ”, 中间列的列值都要用“ ”和“ ”包起来，最后一列要在列值的末尾加上“ ”。新建表单，将视图嵌入表单中，嵌入视图不显示标题。在嵌入视图的上面输入表格的表头，这里要注意，表格要严格按照规范去写。什么是所谓表格规范那？就是一个表格有表头和表体，在HTML 中要用标记区分出来。比如，表头标记是，部分要写在这里，不能写在别处。表体标记是：, 都要写在这一部分里。
例如：

class="tablesorter">

字段1

字段2

字段3

字段4

<!-- 底下就是部分--&gt

<!--嵌入视图--&gt

上例就是一个在表单中的完整表格。表格做好了，要想在浏览器中看到排序表格还需要做一些工作，下面继续展开。

在表单的“HTML首页内容”中增加如下内容：
"　rel='stylesheet'href='/jquery/themes/blue/style.css' type='text/css' media='print, projection,screen' />

，这是TableSorter必需的CSS和JS文件，是放在Domino服务器上的HTML目录下。要想表格展现出来还要在表格的下面加一段js程序:

$(function() {

var rows =$("#tableinbox tbody tr").length;

if(rows>1){

$("#tableinbox").tablesorter({sortList:[[2,1]],widgets:['zebra'],headers: { 0: { sorter: false } } });

}else{

$("#tableinbox").tablesorter({headers: { 0: { sorter: false } } });

}

});

$(document).ready(function(){

$("#selectall").bind("click",doSelect);

});

加上这段程序后，还需要一个工作，那就是再建几个文档，好让视图中有东西可显示。如果这些都做了，那么就可以在浏览器中打开这个表单看一下效果了。应该能看到图1的效果。