java_easyui体系之多级表头及冻结列

最新推荐文章于 2024-08-29 09:23:02 发布

huaying.chen

最新推荐文章于 2024-08-29 09:23:02 发布

阅读量6.8k

点赞数 10

分类专栏： Oscar_front 文章标签： easyui DataGrid 多级表头冻结列 frozenColu

本文链接：https://blog.csdn.net/crave_shy/article/details/48828811

版权

这篇博客介绍了如何使用Java EasyUI实现多级表头和冻结列的功能。在多级表头部分，详细讲解了效果展示、代码实现以及关键点说明，强调了设置rowspan和colspan的方法。在冻结列部分，分别讨论了单级表头和多级表头（包括包含和不包含子表头的情况）的冻结列配置。

摘要由CSDN通过智能技术生成

一：简介

项目中使用的Easyui需要配置多级表头、配置也有一些要注意的地方、以及在多级表头的情况下如何设置冻结列。

二：多级表头

效果

多级表头效果图

代码

<script>            
        $(function(){
    
            $('#dg').datagrid({
                data:[
                    {
   "productid":"FI-SW-01","productname":"Koi","unitcost":10.00,"status":"P","listprice":36.50,"attr1":"Large","itemid":"EST-1"},
                    {
   "productid":"K9-DL-01","productname":"Dalmation","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Spotted Adult Female","itemid":"EST-10"},
                    {
   "productid":"RP-SN-01","productname":"Rattlesnake","unitcost":12.00,"status":"P","listprice":26.50,"attr1":"Rattleless","itemid":"EST-12"},
                    {
   "productid":"RP-LI-02","productname":"Iguana","unitcost":12.00,"status":"P","listprice":35.50,"attr1":"Green Adult","itemid":"EST-13"},
                    {
   "productid":"FL-DSH-01","productname":"Manx","unitcost":12.00,"status":"P","listprice":158.50,"attr1":"Tailless","itemid":"EST-14"},
                    {
   "productid":"FL-DSH-01","productname":"Manx","unitcost":12.00,"status":"P","listprice":83.50,"attr1":"With tail","itemid":"EST-15"},
                    {
   "productid":"FL-DLH-02","productname":"Persian","unitcost":12.00,"status":"P","listprice":23.50,"attr1":"Adult Female","itemid":"EST-16"},
                    {
   "productid":"FL-DLH-02","productname":"Persian","unitcost":12.00,"status":"P","listprice":89.50,"attr1":"Adult Male","itemid":"EST-17"},
                    {
   "productid":"AV-CB-01","productname":