dojo小例子(3)DataGrid对静态数据的增删
来源:互联网 发布:七年级上册数学行知天下答案 编辑:程序博客网 时间:2024/06/06 09:32
<!DOCTYPE html><html ><head><link rel="stylesheet" href="../dojo-release-1.9.1/dijit/themes/claro/claro.css"><style type="text/css">@import '../dojo-release-1.9.1/dojox/grid/resources/claroGrid.css';/*Grid needs an explicit height by default*/#gridDiv { height: 15em;}</style><script src='../dojo-release-1.9.1/dojo/dojo.js'></script><script> require(['dojo/_base/array', 'dojo/_base/lang', 'dojo/_base/event', 'dojo/on', 'dojox/grid/DataGrid', 'dojo/data/ItemFileWriteStore', 'dijit/form/Button', 'dojo/dom', 'dojo/parser', 'dojo/domReady!'], function(array, lang, event, on, DataGrid, ItemFileWriteStore, Button, dom, parser){ parser.parse(); /*set up data store*/ var data = { identifier: "id", items: [] }; var data_list = [ { col1: "normal", col2: false, col3: 'But are not followed by two hexadecimal', col4: 29.91}, { col1: "important", col2: false, col3: 'Because a % sign always indicates', col4: 9.33}, { col1: "important", col2: false, col3: 'Signs can be selectively', col4: 19.34} ]; var rows = 5; for(i = 0, l = data_list.length; i < rows; i++){ data.items.push(lang.mixin({ id: i+1 }, data_list[i%l])); } store = new ItemFileWriteStore({data: data}); /*set up layout*/ var layout = [[ {'name': 'Column 1', 'field': 'id', 'width': '100px'}, {'name': 'Column 2', 'field': 'col2', 'width': '100px'}, {'name': 'Column 3', 'field': 'col3', 'width': '200px'}, {'name': 'Column 4', 'field': 'col4', 'width': '150px'} ]]; /*create a new grid*/ grid = new DataGrid({ id: 'grid', store: store, structure: layout, rowSelector: '20px'}); /*append the new grid to the div*/ grid.placeAt("gridDiv"); /* attach an event handler */ on(button2,'click', function(e){ /* set the properties for the new item: */ var myNewItem = {id: (++i), col1: "Mediate", col2: true, col3: 'Newly added values', col4: 8888}; /* Insert the new item into the store:*/ store.newItem(myNewItem); } ); /* attach an event handler */ on(button1,'click', function(e){ /* Get all selected items from the Grid: */ var items = grid.selection.getSelected(); if(items.length){ /* Iterate through the list of selected items. The current item is available in the variable "selectedItem" within the following function: */ array.forEach(items, function(selectedItem){ if(selectedItem !== null){ /* Delete the item from the data store: */ store.deleteItem(selectedItem); } /* end if */ }); /* end forEach */ } /* end if */ event.stop(e); } ); /*Call startup() to render the grid*/ grid.startup();}); require(['dojo/parser', 'dojo/domReady!'], function(parser){ parser.parse(); }); </script></head><body class="claro"> <p> This example shows, how to add/remove rows</p><div id='gridDiv'></div><p> <button data-dojo-id='button2' id='button2'> Add Row </button> <button data-dojo-id='button1' id='button1'> Remove Selected Rows </button></p></body></html>
0 0
- dojo小例子(3)DataGrid对静态数据的增删
- dojo小例子(4)DataGrid对动态数据的增删
- dojo小例子(14)对提供给grid显示的数据进行预处理
- dojo小例子(12)form转换成带内部对象的json数据
- dojo小例子(23)EnhancedGrid、DataGrid当加载完成后获取记录总数
- jquery对json数据进行增删改查的例子
- dojo小例子(6)页面打开后,请求数据,把反馈数据回填页面
- dojo小例子(15)给dojo on的事件处理函数传递自定义参数的两种方法
- 使用 Dojo 和 Grails 快速实现数据的增删改查(CRUD)
- exttree增删改的小例子
- DOJO grid一个小例子
- dojo小例子(29)FilteringSelect在IE8下对输入法(IME)无响应不弹出suggest
- dojo小例子(9)动态创建带label的CheckBox集合
- dojo小例子(10)改变grid选中行的列值
- dojo小例子(20)动态加载的Select增加一个option空白项
- dojo小例子(22)自定义dijit Tree的节点图标
- dojo小例子(34)带Ajax异步验证功能的ValidationTextBox
- cometd Dojo jetty整合的一个小例子
- HDU 4004
- 转:问题与总结
- Centos install Chinese
- 三层架构模式(开发实践很重要)
- android sqlite使用详解
- dojo小例子(3)DataGrid对静态数据的增删
- JAVA中implement和extends的区别
- The steps for download android source code
- 从尾到头打印链表
- POJ - Matrix Power Series 【矩阵快速幂+二分求和】
- 浅析移动开发
- JDBC批处理
- [PHP]php源码解析之源码目录结构
- Go语言发邮件