dojo1.1.0学习总结--简单表格案例

前端之家收集整理的这篇文章主要介绍了dojo1.1.0学习总结--简单表格案例前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
前台页面: <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>简单表格案例</title> <!-- 表格样式 --> <style type="text/css"> @import "js/dojo-release-1.1.0/dojox/grid/_grid/Grid.css"; </style> <!-- 导入dojo库 --> <script type="text/javascript" src="js/dojo-release-1.1.0/dojo/dojo.js" djConfig="parSEOnLoad: true"></script> <!-- 导入组件包 --> <script type="text/javascript"> dojo.require("dojox.grid.Grid"); dojo.require("dojox.grid._data.model"); dojo.require("dojo.parser"); </script> <script type="text/javascript"> //表格数据 data = [ [ '张三',25,'男','58429046',['北京','上海']],[ '李四',26,'上海'],[ '王五',27,[ '赵六',28,'上海'] ]; //表格模型 model = new dojox.grid.data.Table(null,data); //表格表头 var columns = {cells: [[ {name: '姓名',width:"15%"},{name: '年龄',{name: '性别',{name: '电话',width:"40%"},{name: '地址',width:"15%"} ]] }; //表头层 var layout = [ columns ]; </script> </head> <body class="tundraGrid"> <div id="grid" dojoType="dojox.Grid" model="model" structure="layout"></div> </body> </html> dojo 1.1.0 学习总结 六. 表格案例 1.导入样式,库,组件 <!-- 表格样式 --> <style type="text/css"> @import "js/dojo-release-1.1.0/dojox/grid/_grid/Grid.css"; </style> <!-- 导入dojo库 --> <script type="text/javascript" src="js/dojo-release-1.1.0/dojo/dojo.js" djConfig="parSEOnLoad: true"></script> <!-- 导入组件包 --> <script type="text/javascript"> dojo.require("dojox.grid.Grid"); dojo.require("dojox.grid._data.model"); dojo.require("dojo.parser"); </script> 2.编写表格脚本 <script type="text/javascript"> //表格数据 data = [ [ '张三',width:"15%"} ]] }; //表头层 var layout = [ columns ]; </script> 注:此部分每一步都是必须的 3.显示表格的层 <div id="grid" dojoType="dojox.Grid" model="model" structure="layout"></div> 注: 1. structure="layout" 表示表格的结构,即列头 2. model="model" 表示表格的数据模型 原文链接:https://www.f2er.com/dojo/291883.html

猜你在找的Dojo相关文章