分类: dhtmlx JavaScript2012-01-31 15:41 1744人阅读 评论(0) 收藏 举报
 

目录(?)[+]

 

因为有对于页面显示和打印的需求,所以对于dhtmlxgrid进行了简单的学习,参照dhtmlxgrid给出的例子进行摸索

1、必须引入的js包

  1. <link rel="STYLESHEET" type="text/css" href="css/dhtmlxgrid.css">
  2. <link rel="stylesheet" type="text/css" href="css/dhtmlxgrid_dhx_skyblue.css">
  3. <link rel="STYLESHEET" type="text/css" href="css/dhtmlxcalendar.css">
  4. <script  src="js/dhtmlxcommon.js"></script><!--dhtmlx基础js-->
  5. <script  src="js/dhtmlxgrid.js"></script><!--dhtmlxgrid基础js-->
  6. <script  src="js/dhtmlxgridcell.js"></script><!--dhtmlxgrid基础js-->
  7. <script  src="js/dhtmlxcalendar.js"></script><!--对日期控件的支持-->
  8. <script  src="js/dhtmlxgrid_excell_dhxcalendar.js"></script><!--对日期控件的支持-->
  9. <link rel="STYLESHEET" type="text/css" href="css/dhtmlxcalendar_dhx_skyblue.css">

2、初始化代码

2.1、在页面上先放一个表格容器

  1. <div id="gridbox" style="width:503px;height:120px;background-color:white;"></div>

2.2、页面初始化

  1. <script>
  2. mygrid = new dhtmlXGridObject('gridbox');//类似于一个声明
  3. mygrid.setImagePath("/imgs/");           //设置图片存放路径
  4. mygrid.setHeader("Name,Date of Birth, First Book Published");//设置表格表头名称
  5. mygrid.setInitWidths("*,100,100");       //设置表格初始列宽
  6. mygrid.setColAlign("left,center,center");//设置表格对齐方式
  7. mygrid.setColTypes("ed,dhxCalendar,dhxCalendarA");//设置各列的数据类型
  8. mygrid.setColSorting("str,date,date");   //设置各列的排序类型
  9. mygrid.setSkin("dhx_skyblue");           //设置样式
  10. mygrid.init();                           //进行初始化
  11. mygrid.loadXML("data.xml");              //加载外部数据
  12. </script>
附:
setColTypes支持的列类型

ro

只读

ed

少量文本,双击原位编辑

txt

大量文本,双击弹出一个文本区域进行编辑

ch

复选框,选中值为1,未选值为0

ra

单选框,一列中只能有一个被选中,选中值为1

coro

下拉列表,用户只能选择列表中已有的值

co

复合下拉列表,用户可以选择,也可以自行输入

img

图片,只读,值为图片的url

link

链接,值的格式为“链接文字^链接地址”,非正常超链接写法。(需加载dhtmlXGrid_excell_link.js文件对其支持)

calendar

日期,双击弹出日历。日期格式为MM/DD/YYYY。需加载dhtmlXGrid_excell_calendar.js文件对其支持,且加载此文件前需定义全局变量_css_prefix、_js_prefix如下:<script>_css_prefix="styles/"; _js_prefix="js/"; </script>

setColSorting支持的排序类型:

int

整型

str

字符串

date

日期

dhtmlxgrid v3.0学习笔记的更多相关文章

  1. DirectX 总结和DirectX 9.0 学习笔记

    转自:http://www.cnblogs.com/graphics/archive/2009/11/25/1583682.html DirectX 总结 DDS DirectXDraw Surfac ...

  2. 一起学ASP.NET Core 2.0学习笔记(二): ef core2.0 及mysql provider 、Fluent API相关配置及迁移

    不得不说微软的技术迭代还是很快的,上了微软的船就得跟着她走下去,前文一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx.superviso ...

  3. vue2.0学习笔记之路由(二)路由嵌套+动画

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. vue2.0学习笔记之路由(二)路由嵌套

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. hdcms v5.7.0学习笔记

    hdcms v5.7.0学习笔记 https://note.youdao.com/ynoteshare1/index.html?id=c404d63ac910eb15a440452f73d6a6db& ...

  6. OAuth 2.0学习笔记

    文章目录 OAuth的作用就是让"客户端"安全可控地获取"用户"的授权,与"服务商提供商"进行互动. OAuth在"客户端&quo ...

  7. 一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx、supervisor、mysql环境搭建

    作为.neter,看到.net core 2.0的正式发布,心里是有点小激动的,迫不及待的体验了一把,发现速度确实是快了很多,其中也遇到一些小问题,所以整理了一些学习笔记: 阅读目录 环境说明 安装C ...

  8. RxJava2.0学习笔记2 2018年7月3日 周二

    摘记: 1.map -- 转换  有些服务端的接口设计,会在返回的数据外层包裹一些额外信息,这些信息对于调试很有用,但本地显示是用不到的.使用 map() 可以把外层的格式剥掉,只留下本地会用到的核心 ...

  9. thinkphp5.0学习笔记

    2019-11-11学习笔记 安装TP5.0 a)源代码包下载 在thinkphp官网下载(www.thinkphp.cn)下载 完整版本的TP5.0 b) composer 安装 切换到网站的根目录 ...

随机推荐

  1. 40: Redraiment的走法(不连续最长子字符串)

    题目描述 :   Redraiment是走梅花桩的高手.Redraiment总是起点不限,从前到后,往高的桩子走,但走的步数最多,不知道为什么?你能替Redraiment研究他最多走的步数吗? 样例输 ...

  2. android开发游记:meterial design 5.0 开源控件整套合集 及使用demo

    android 的5.0公布不光google官方给出了一些新控件,同一时候还给出了一套符合material design风格的设计标准,这套标准将未来将覆盖google全部产品包括pc端,站点,移动端 ...

  3. 二分Kmeans的java实现

    刚刚研究了Kmeans.Kmeans是一种十分简单的聚类算法.可是他十分依赖于用户最初给定的k值.它无法发现随意形状和大小的簇.最适合于发现球状簇.他的时间复杂度为O(tkn).kmeans算法有两个 ...

  4. 浅谈C/C++堆栈指引——C/C++堆栈

    C/C++堆栈指引 Binhua Liu 前言 我们经常会讨论这种问题:什么时候数据存储在飞鸽传书堆栈(Stack)中.什么时候数据存储在堆(Heap)中.我们知道.局部变量是存储在堆栈中的.debu ...

  5. MySQL_知识点

    1.执行顺序 语句模板: (8)SELECT (9)DISTINCT (11)<Top Num> <select list> (1)FROM [left_table] (3)& ...

  6. iOS中三种方式实现登录界面播放视频或gif效果

    现在app都做的越来越炫酷,各种动画效果,各种特效很好的提高了用户的体验.很多app在登录界面都使用了动画效果,比如Uber,Keep,QQ等等.这些动画效果基本都是使用gif或者MP4来实现的. 效 ...

  7. 尽管是一个CS专业的学生,小B的数学基础很好并对数值计算有着特别的兴趣,喜欢用计算机程序来解决数学问题。现在,她正在玩一个数值变换的游戏。她发现计算机中经常用不同的进制表示同一个数,如十进制数123表达为16进制时只包含两位数7、11(B),用八进制表示时为三位数1、7、3。按不同进制表达时,各个位数的和也不同,如上述例子中十六进制和八进制中各位数的和分别是18和11。

    include "stdafx.h" #include<iostream> #include<vector> #include <algorithm& ...

  8. PHP性能:序——谈ab(Apache Bench)压力测试工具

    PHP性能:序——谈ab(Apache Bench)压力测试工具 ab(Apache  Bench)是啥? ab是Apache自带的一个压力测试软件,可以通过ab命令和选项对某个URL进行压力测试.a ...

  9. find 多文件查找需要单引号

    [root@db01 local]# find  -name '*.com'|xargs egrep "qq"./tt.com:qq[root@db01 local]# find  ...

  10. CLR内存回收机制

    代龄机制. 通过递归构建可达对象图,不可达的对象会被回收,然后CLR会矫正对象指针. 对于终止化/Finalize对象, 一开始时这些对象指针/根/引用会被放到终止化链表中,当CLR垃圾收集开始时,那 ...