请选择 进入手机版 | 继续访问电脑版

学JAVA网

 找回密码
 立即注册

Easyui学习之 datagrid数据表格组件的使用

[复制链接]
发表于 2018-5-12 18:36:53 |显示全部楼层
   
    管理类项目开发中 以数据展示类功能居多 而表格更是我们经常使用的展示形式,如果客户说 能不能排一下序,能不能分页 能不

能...是不是有点眩晕,虽然这些功能我们都可以实现 但是必然自己要写大量的代码以及样式布局 ,那么easyui 中的easyui


datagrid组件就是你的救星。

    EasyUI datagrid组件以表格形式展示数据,并提供了丰富的选择、排序、分组和编辑数据的功能支持。

datagrid组件设计用于缩短开发时间,并且使开发人员不需要具备特定的知识。它是轻量级的且功能丰富。单元

格合并、多列标题、冻结列和页脚只是其中的一小部分功能。


0:创建一个easyui datagrid组件
   
   创建datagrid有两种方式

   第一种:使用标签方式创建
  1. <table class="easyui-datagrid">
  2.               <tr>
  3.                   <td>小明</td>
  4.                   <td>18岁</td>
  5.                </tr>
  6. </table>
复制代码
第二种方式:使用js脚本方式创建
  1. html代码:
  2.               <table id="dg"></table>
  3.        js代码:
  4.             $("#dg").datagrid({
  5.                   width:100,
  6.                   height:200
  7.              })  
复制代码
实例:查询班级所有学生信息  并使用表格的形式展示出来
   
       1:创建一个html页面 我们将其命名为index.html,如下图所示

       2:编辑一个table标签 并且使用js脚本将其做为一个datagrid组件
   
   



ed
您需要登录后才可以回帖 登录 | 立即注册

Archiver|手机版|学JAVA网

GMT+8, 2018-11-18 09:55 , Processed in 0.143050 second(s), 24 queries .

Powered by Discuz! X2.5

© 2001-2012 Comsenz Inc.

Copyright © 2015-2018 xuejava网 / 鲁ICP备17054568号-1
回顶部