分页

http://www.tele21.com.cn/jiaoliu/show.asp?classid=747

B/S架构下联动式分页列表框

作者：纵横软件制作中心 雨亦奇 摘自赛迪网 　　一、设计联动式分页列表框的原由 　　在B/S架构下动态网站的开发过程中，我们经常遇到这样一类管理性质的问题，即选定一种对象后想为该对象添加或删除一个或多个属性或权限，例如系统管理员进行的组用户管理，先选定一个组，然后既可以向这个组中添加一些用户，也可以从这个组中删除几个用户。又如文档管理员进行的文档传阅管理，选定一篇文档后，就可为此文档添加阅读者、删除阅读者，从而实现对文档阅读人群的管理，控制谁能看和谁不能看，等等。这样一类问题的模式，我称为组用户管理模式。 　　对于组用户管理模式的问题，通常采用如下方法解决： 　　1、设计主操作页面（见图1，以组用户管理为例）； 　　2、设计添加、删除等辅操作页面，它们均通过主操作页面的按钮来激活。 　　主操作页面一般分为"可供选择的组"、"不在当前组中的用户"（亦即候选用户）、"操作"和"当前组中的用户"四栏。"可供选择的组"、"不在当前组中的用户"和"当前组中的用户"三栏每栏均是一个SELECT列表框，所有数据全部放入列表框中供用户查看或选择用。根据所选组的不同，"不在当前组中的用户"与"当前组中的用户"两栏数据亦相应改变，所谓"联动"，意在于此。 　　图1. 普通的列表框示范页面 　　　　 　　可将不在当前组中的用户加入到当前组中; 　　亦可通过删除按钮: 　　　　 　　将当前组中的某些用户除去，转到"不在当前组中的用户"一栏。对于添加和删除操作，采用及时更新数据库的处理手段。 　　将所有数据全部放入列表框中，这个想法很简单，数据量小时也很有效，但是对于一个动态网站的开发（尤其是大型商业网站），任何人都必须面对这样一个重大考验：随着时间的推移，数据量逐渐增大，如此做法所产生的页面数据将越来越大，浏览器下载页面时间会加长，用户的操作得不到及时响应，令用户失去耐心，从而使网站声誉受损。 　　怎么办呢？只有化整为零，按需存取，采用分页技术来解决了：显示时一次只显示一页内容的数据，若想看其它页，点击翻页链接即可。这样实现起来，页面数据量小，响应速度快，颇受用户欢迎。分页技术的具体实现，不同的人可能采用不同的方法，而我经过悉心研究，设计成功通用的联动式分页列表框，为组用户管理模式下的分页问题提供了完美的解决方案。 　　二、联动式分页列表框的设计 联动式分页列表框（见图2），形式简单，操作有效。它是在普通列表框的基础上，在其右侧新增一排按钮， 　　　　 　　　　用于实现翻页功能。 　　　　 　　　　按钮用于向前翻页， 用于向后翻页。 　　当按钮置灰时，相应翻页功能被系统禁止。 　　图2. 联动式分页列表框 　　分页列表框上有一行标题行，标题中类似M/N形式的数字，其含义是"本栏分页列表框共有N页，当前显示的是第M页"，明确地表示了分页信息。例如图2中显示的"可供选择的组(1/2)"表示可供选择的组共有2页，当前显示的是第1页。 　　点击"可供选择的组"一栏的翻页按钮后，该栏的列表框内容相应改变为上一页或下一页的内容。由于联动作用，"不在当前组中的用户"与"当前组中的用户"两栏的分页列表框内容将随着组的改变而改变。 　　如果所选择的组不变，则"不在当前组中的用户"与"当前组中的用户"两栏的翻页操作均不影响对方分页列表框的内容，即"不在当前组中的用户"一栏翻页时，"当前组中的用户"一栏显示内容不会改变，同样在"当前组中的用户"一栏进行翻页操作时，"不在当前组中的用户"一栏显示内容也不会改变。 　　通过联动式分页列表框，用户可方便地选择组，方便地为组增删用户。对于本页中增删的用户，要想生效，需点击"确认"按钮，以更新数据库。因为考虑到增删用户后操作者可能忘了点"确认"按钮而直接点击任何一个翻页按钮想翻页，为方便起见，我在实现时亦提供了确认的提示，确认后程序自动更新数据，随后自动翻页。 　　三、联动式分页列表框的实现 　　联动式分页列表框的程序，采用了现今B/S架构下最为流行JavaBean+JSP技术实现：用JAVA语言编写后台调用的JavaBean类，用于数据库操作和实现分页等功能；用JSP（Java Server Pages）编写动态网页，用于展示分页和响应用户操作。（注：详细程序见附件，本文只扼要介绍其内在机制，为方便用户理解，特提供JavaBean类程序的Rose模型。建立Rose模型的好处，在于直观，好理解，并且可利用Rose工具自动生成Java代码或相关文档。） 　　(一) JavaBean类 　　1、 ResultRow.java 　　图3、ResultRow模型 　　程序解析： 　　ResultRow表示的是查询结果集中的一行结果，它继承了Hashtable（哈希表）这个类，故而便于利用字段名来存取其值。 　　ResultRow中提供getValue方法，用于根据所指定的字段名，将其对应的值取出来。 　　2、 QueryResult.java 　　图4、QueryResult模型 　　程序解析： 　　QueryResult表示的是整个查询结果集，它的父类是Vector（向量），其中的每一个单元均是一个ResultRow结果行。 QueryResult提供了getRow的方法，可根据指定行号lineno，将该行的结果行取出使用。 　　3、 DBCon.java 　　图5、DBCon模型 　　程序解析： 　　DBCon是用来与数据库打交道的类，从模型中可以看到它有四个私有变量: 　　① HOST：为WebLogic服务器所在主机，默认值为"localhost"； 　　② PORT：为WebLogic服务器所用端口，默认值为"7001"； 　　③ NAME：为数据源名字，默认值为"oracleDS"； 　　④ conf：这是个哈希表，用于存贮与数据库连接相关的配置信息。它在类的静态初始化过程中被设置，其数据为整个类所共享。下面是静态初始化代码： static { conf = new Hashtable(); conf.put(Context.INITIAL_CONTEXT_FACTORY,"weblogic.jndi.WLInitialContextFactory"); conf.put(Context.PROVIDER_URL,"t3://" + HOST + ":" + PORT); } 　　DBCon提供了两种通用的数据库操作功能：一个是查询，方法是runQuery，执行后返回的是QueryResult查询结果集；另一个是更新，方法是runUpdate，执行后返回的则是受操作影响的记录行数。这两个功能均是根据用户提供的SQL语句进行相应操作的。 　　DBCon进行数据库操作时，利用的是WebLogic服务器内置的数据库连接池，并用JNDI数据源技术获取一个数据库连接。利用WebLogic服务器内置连接池的好处：一是易管理，因为WebLogic提供了通过网页进行连接池等系统配置的功能；二是程序书写简洁，清晰；三是可大幅提高程序性能。请看下面runUpdate方法的源程序（每行前面的数字为行号）： 1 public static int runUpdate(String sql) throws Exception 2 { 3 Context ctx = new InitialContext(conf); 4 DataSource ds = (DataSource) ctx.lookup(NAME); 5 Connection conn = ds.getConnection(); 6 Statement stmt = conn.createStatement(); 7 int rc; 8 try 9 { 10 rc = stmt.executeUpdate(sql); 11 } 12 catch (Exception ex) 13 { 14 throw new Exception("SQL: /"" + sql + "/" 执行出错，原因是：" + ex.getMessage()); 15 } 16 stmt.close(); 17 conn.close(); 18 ctx.close(); 19 return rc; 20 } 注： 第3行：根据conf配置信息，初始化后得到一个JNDI上下文ctx。 第4行：在上下文ctx中获得名为NAME的数据源ds。 第5行：从数据源ds中获得一个连接conn。 第6行：由连接conn新建一个语句对象stmt。 第10行：执行用户SQL语句sql。 第16-18行：关闭所有资源。 第19行：返回受影响的记录行数rc。 　　4、 QueryPage.java 　　图6、QueryPage模型 　　程序解析： 　　QueryPage是用来获取分页数据的类。 　　从模型可以看到，该类有三个私有变量： 　　① linesPerPage：为每页行数，默认为1。 　　② totalPages：为查询分页后得到的总页数，默认为1。 　　③ result：为查询返回的结果集，默认为null（空）。 　　该类有三个公用的方法： 　　① init：查询初始化，主要是调用DBCon的runQuery方法，执行用户提供的SQL命令，并将查询结果进行分页处理。 　　② isInit：检测是否已初始化。 　　③ getPage：根据用户提供的页号，将该页结果行返回，返回值类型为ResultRow[]（结果行数组）。 　　5、Utilities.java 　　图7、Utilities模型 　　程序解析： 　　Utilities是个工具类，主要用来为JSP网页获取的参数进行一些转换（如字符串转为数字等），并且不抛出任何异常。 　　该类有两个方法： 　　① trim：用于将字符串前后空格去掉。当字符串为null（空）时，将其视同""（空串）。 　　② atoi：用于将字符串转换为数字，忽略转换过程中发生的异常。有异常时，得到的数字默认为0。 　　（二）JSP动态网页 　　1、 zhsoft.jsp 　　该JSP文件用来展示联动式分页列表框的内容，是主页面。 　　它接收如下参数： 　　① group_id："可供选择的组"一栏中已选中的组的ID（当前组ID）。 　　② group_pageno："可供选择的组"一栏的页号（ 简称组列表框页号）。 　　③ candidate_pageno："不在当前组中的用户"一栏的页号（简称候选列表框页号）。 　　④ current_pageno："当前组中的用户"一栏的页号（简称当前列表框页号）。 　　⑤ apply_flag：为确认更新标志。该标志由apply.jsp在更新数据库后传来，zhsoft.jsp得到后若发现其大于0，则需要重新初始化查询，更新主页面。 　　它还定义了如下常量（用户可根据实际情况加以修改）： 　　① LINES_PER_PAGE：指的是每页数据的行数，用于分页。 　　② SELECT_LINES：定义的是分页列表框的高度。 　　③ COLUMN_NAME_OF_VALUE：定义的是分页列表框选项之值所对应的数据库字段名。 　　④ COLUMN_NAME_OF_LABEL：定义的是分页列表框选项显示之值所对应的数据库字段名。 　　zhsoft.jsp建立了四个JavaBean的实例： 　　① 　　② 　　③ 　　④ 　　第一个是Utilities工具类的实例，ID为u。后面三个均是QueryPage类的实例，ID分别为group,candidate和current，对应组列表框、候选列表框和当前列表框的查询及分页。 　　zhsoft.jsp生成动态页面的过程是：首先接收参数，根据参数判断是否应该进行查询初始化（即调用QueryPage的init方法，刷新页面数据），之后对各栏页号进行修正，防止传来非法页号，最后取出指定页号的数据（即调用QueryPage的getPage方法），输出到页面中。 　　为了提高操作效率，zhsoft.jsp中嵌入了大量的javascript脚本函数，用于实现添加和删除的操作，点击"确定"按钮后，才调用apply.jsp批量更新数据库。 　　2、 apply.jsp 　　该JSP文件用来接受主页面传来的增加、删除等参数，根据参数内容，对数据库进行更新操作，完成后再返回到主页面。 apply.jsp需要获取的参数有： 　　① group_id：当前组ID 　　② group_pageno：组列表框页号 　　③ candidate_pageno：候选列表框页号 　　④ current_pageno：当前列表框页号 　　⑤ added：要增加的用户ID列表（以逗号分隔） 　　⑥ deleted：要删除的用户ID列表（以逗号分隔） 　　apply.jsp对要增删的用户ID列表，用StringTokenizer类进行分析，然后逐一调用DBCon类的runUpdate方法进行增删操作，更新数据库。 　　apply.jsp在完成更新操作后，使用了一个隐含的FORM表单formApply，该表单的目标是zhsoft.jsp，故该表单提交后，便返回到了联动式分页列表框的主页面。 　　3、 error.jsp 　　此为JSP文件的出错页面。当JSP编译时出现异常时，Web服务器将此异常抛给此页面进行处理。此页面内容很简单，只是将异常信息显示了出来，故在此不赘述。 　　四、联动式分页列表框的测试 　　联动式分页列表框程序用的Web服务器是WebLogic6.1，数据库用的是Oracle8i。测试前需要配置以下内容： 　　1、配置WebLogic6.1内置连接池oraclePool与数据源oracleDS。 　　操作步骤如下： 　　① 以system用户身份登录WebLogic6.1的主控制台页面（如http://localhost:7001/console）； 　　② 建立JDBC连接池oraclePool的基本信息，画面如下： 　　图8、配置JDBC连接池 点击"Create"按钮创建oraclePool连接池。 　　③为oraclePool连接池选定服务myserver，这样myserver启动后，该连接池便可使用了，设定画面如下： 　　图9、将连接池加载到服务中 　　选定后按"Apply"按钮使之生效。 ④建立数据源oracleDS（JNDI名字），它映射为oraclePool连接池，设置画面如下： 　　图10、为连接池建立数据源 　　按"Create"建立oracleDS数据源，之后不要忘了点击"Targets"，此时将出现与第③步类似的画面，将该数据源应用到myserver服务中，按"Apply"使其生效。 　　2、拷贝程序：将联动式分页列表框的JSP文件（zhsoft.jsp、apply.jsp和error.jsp）和JavaBean程序的执行代码（CLASS文件）复制到WebLogic6.1的DefaultWebApp目录下，将按钮图象文件复制到DefaultWebApp/images目录下。 　　3、启动Oracle数据库，建立TEST_USER（用户表）,TEST_GROUP（组表）,GROUP_USER（组用户表）三张表，表结构如下：（用PowerDesigner设计） 　　图11、测试用表结构 表建立后，需向用户表和组表中加入一些测试数据。 4、启动WebLogic6.1，大功告成，浏览http://localhost:7001/zhsoft.jsp即可体验联动式分页列表框的新感觉了。 　　小结：联动式分页列表框是根据实践经验总结提炼出来的，它适合组用户管理模式一类的B/S应用，用户可根据实际情况稍加修改即可使用。本文对联动式分页列表框，从设计到实现再到测试，结合Rose分析模型，进行了介绍。相信用户通过阅读和实践，是能够大有斩获的。 　　联动式分页列表框源代码 　　作者信息 　　稿件作者： 雨亦奇。纵横软件制作中心为本人之个人工作室。