DHTMLX 前端框架 建立你的一个应用程序教程(一)
介绍
此教程包含是多方面的:
1.如何在页面上添加标准的dhtmlx组建
2.如何在页面上组织组件
3.如何添加过滤
4.如何从服务器端获取数据填充组建
5.如何保存用户修改的数据到服务器上
6.如何使组建整体配合运行
这是一个简单的联系人管理教程 它包含了下列组建:工具条、菜单、表格、表单、布局等

第一部分:创建应用程序的文件
首先,我们需要引入相关的框架文件! 标准版 下载页面 (专业版据说也可以获取 答案上篇dhtmlx开篇找。。)
下载完成后 我们从codebase文件夹中把dhtmlx.js以及dhtmlx.css 这两个文件引入到页面中去..(肯定是css在前)
步骤:
1.下载文件包 dhtmlxSuite
2.在项目中创建文件夹contact_manager
3.解压文件把codebase放到 contact_manager 文件夹里
4.找到dhtmlx_std_full_web_skin.zip 放到codebase中

5.在codebase文件夹外添加index.html

6.在index.html文件中添加如下代码:
<!DOCTYPE html>
<html>
<head>
<title>Contact Manager</title>
<link rel="STYLESHEET" type="text/css" href="codebase/dhtmlx.css">
<script src="codebase/dhtmlx.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
//the code of your application
</script>
</body>
</html>
DHTMLX 前端框架 建立你的一个应用程序教程(一)的更多相关文章
- DHTMLX 前端框架 建立你的一个应用程序 教程(十一)--添加/删除表格中的记录
添加/删除表格中的记录 我们的最终功能是在表格中添加删除 我们通过单机工具栏上的按钮来实现添加删除 当我们单击添加按钮的时候, 表单中 第一行默认填写New contact 光标自动聚焦 当用户点击删 ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(六)-- 表格加载数据
从数据库加载数据 这篇我们介绍从MySQL数据库中加载数据到表格 我们使用 MySql的数据库dhtmlx_tutorial 和表contacts 示例使用的是PHP平台和dhtmlxConnecto ...
- DHTMLX 前端框架 建立你的一个应用程序教程(三)--添加一个菜单
菜单的介绍 这篇我们介绍将菜单组建添加到上节中的布局中: 我们不对菜单做任何处理 只是在这里填充作为界面的一部分. 这里我们介绍的是dhtmlxMenu 组件. 这个组件的数据我们可以从XML或者J ...
- DHTMLX 前端框架 建立你的一个应用程序教程(二)--设置布局
Layout控件的演示 Dhtmlx有很多的组建来组织网页的建设, 这篇主要介绍dhtmlxLayout . 下面图片中 布局将各个组件(1.Menu 2.Toolbar 3.Grid 4.Form ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(十)--保存表单中的数据
保存表单中的数据 现在我们所要做的是 当用户点击提交按钮的时候 我们将表单中的数据进行保存操作. 我们可以使用dhtmlxDataProcessor. 来进行操作.它是一个数据组件,可以提供与服务器 ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(九)--绑定表单Form到表格Grrid中
绑定表单Form到表格Grrid中 现在我们需要选中一行表格数据的时候 数据能在表单中显示出来 我们可以使用DHTMLX 丰富的组件功能实现它. 绑定表单到表格 1.调用bind方法将表单绑定到网格, ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(八)-- 添加表单Form
添加表单Form 我们下一步是在页面中添加一个表单,表格中的选中字段将会显示在表单中.提供一个提交按钮 可以对显示的数据进行修改提交. 添加表单到布局单元格中 1.在右侧布局中使用attachForm ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(七)-- 添加筛选功能
表格的过滤筛选 我们在每列第一行添加一个文本,用做数据的条件筛选. 我们还提供服务端的筛选 ,当有大量数据时 , 我们可以使用dhtmlxConnector 进行后台数据的筛选. 添加过滤器到表格列中 ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(五)--添加一个表格Grid
表格例子 样本如下: 我们这篇介绍的是dhtmlxGrid 组件. 它支持4种数据格式:XML, JSON, CSV, JSArray. 添加表格到布局的单元格中去: 1.使用attachGrid( ...
随机推荐
- S-DES加密
Simplified Data Encryption Standard S-DES 是一个供教学的非安全的加密算法,它与DES的特性和结构类似,但参数小,明文分组为8位,主密钥分组为10位,采用两轮迭 ...
- Android Studio之could not reserve enough space for object heap
在用AndroidStudio时出现这样的错误: 每次创建工程后,在项目文件 gradle.properties文件中加入如下代码: org.gradle.jvmargs=-Xmx512m -XX: ...
- Ubuntu server搭建vsftpd小记
Ubuntu server中搭建vsftpd小记 <h1> 在Ubuntu server中安装vsftpd</h1> sudo apt-get install vsftpd & ...
- html代码实现自动滚动,鼠标滑过时停止滚动
<marquee style="width: 1200px;height:200px;margin:0px auto" onmouseout="this.start ...
- ThinkPHP函数详解:R方法
R方法用于调用某个控制器的操作方法,是A方法的进一步增强和补充.关于A方法的用法见这里.R方法的调用格式:R('[项目://][分组/]模块/操作','参数','控制器层名称') 例如,我们定义了一个 ...
- YII数据库操作(CURD操作)
数据库操作 获得模型对象 $model = 模型名::model();或$model = new 模型名(); 1.查询多条记录(返回值:二维数组) $result = $model->find ...
- Nuget 自动上传
1:参考https://newnugetpackage.codeplex.com/wikipage?title=NuGet%20Package%20To%20Create%20A%20NuGet%20 ...
- 找不到可安装的ISAM
转载:http://www.cnblogs.com/zyc2/archive/2005/06/28/182492.html 读取excel数据 到 datagrid 出现:找不到可安装的ISAM ...
- 首页TAB页的技术选择与功能实现
一般的选择是用viewpager,这个有开源库.不过因为要引入开源库,所以有时候显得比较大. 下面这段代码是用在一个BaseActivity上面的,下面继承的Activity直接使用该方法,就可以完成 ...
- ACM——A + B Problem (3)
Home Problems 1086 A + B Problem (3) 时间限制(普通/Java):1000MS/3000MS 运行内存限制:65536KByte总提交:2317 ...