利用XML和XSL生成较为复杂的多表头表格

来源:互联网 发布:魅族mx4系统下载软件 编辑:程序博客网 时间:2024/06/06 14:22

Blog的热情逐渐消退,工作总是忙忙碌碌,cnblogs这一亩三分的自留地早已荒废了一段时间,近日惊闻国家部委将严格处理闲置用地,赶忙回来自留地上耕上两耙,以免被打上“闲置”标签。

刚接手的项目有一查询页面,客户要求的实现格式较为复杂,需要达到合并多行多列的显示效果,由于只是一个小项目,客户方面不愿意引入太多外部的商业控件,剩下的解决方案无外乎是:1.使用DataGrid; 2.使用SQL Reporting Services;3.自己合成html代码输出。

在这些解决方案中,使用DataGrid的话,要达到合并行和列比较麻烦;而Reporting Services合并行和列相对简单,但因为显示结果的列数是动态的,这无论是写SQL和制作Reporting Services的rdl文件都是相当复杂的事。于是惟有通过生成自定义html代码的解决方法了。

在HTML代码中,要实现table元素的表和列合并主要是使用rowspan 和 colspan属性,比如要实现下面的格式输出,
服装颜色码组总数量衬衫 SMLXLXXL  白710234 26
可采用以下的HTML代码:

<table cellSpacing="0" cellPadding="0" border="1" bordercolor="black" style="border-collapse:collapse">
    
<tr align="center" class="titlebar">
        
<td width="120">服装</td>
        
<td width="50">颜色</td>
        
<td colspan="6">码组</td>
        
<td width="50">总数量</td>
    
</tr>

    
<tr align="center">
        
<td rowspan="2">衬衫</td>
        
<td class="sizebar">&nbsp;</td>
        
<td width="40" class="sizebar">S</td>
        
<td width="40" class="sizebar">M</td>
        
<td width="40" class="sizebar">L</td>
        
<td width="40" class="sizebar">XL</td>
        
<td width="40" class="sizebar">XXL</td>
        
<td width="40" class="sizebar">&nbsp;</td>                
        
<td class="sizebar">&nbsp;</td>
    
</tr>
    
<tr>
        
<td align="center"></td>
        
<td align="right">7</td>        
        
<td align="right">10</td>
        
<td align="right">2</td>
        
<td align="right">3</td>
        
<td align="right">4</td>
        
<td align="right">&nbsp;</td>                
        
<td align="right">26</td>
    
</tr>                        
</table>

要达到输出如此效果的HTML,而又不是在代码处进行硬编码,实现数据和页面输出的分离,XSL和XML结合自然就是不二之选了。通过从数据库中查询得到的结果集合生成指定格式的xml,然后通过预先写好的XSL结合,就可实现需要的效果。

之前并未接触太多的XSL方面的知识,只是有一个初步的理解,实际操作起来方知XSL这款所谓的“编程”语言,对于习惯既有编程语言模式的程序员而言可谓“噩梦”,很多的处理方法颠覆了既有的处理方法,有赖于强大的Google搜索引擎,方能勉强实现所要效果.

附件(下载)中的例子使用Vs.net 2003,只是一个简单的实现。XSL并不熟悉,写得较为凌乱,欢迎讨论。实现的效果可以参考下面的图:


附XSL文件

WarehouseLayout.xsl


示例XMLl文件

XML Sample


http://www.cnblogs.com/yeti/articles/667117.html

原创粉丝点击