+++ /dev/null
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
-<html>
-<head>
- <title>dojox.Grid with Dojo.Data via binding</title>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
- <style type="text/css">
- @import "../_grid/tundraGrid.css";
- @import "../../../dojo/resources/dojo.css";
- @import "../../../dijit/themes/tundra/tundra.css";
- @import "../../../dijit/tests/css/dijitTests.css";
-
- #grid, #grid2, #grid3 {
- width: 65em;
- height: 25em;
- padding: 1px;
- }
- </style>
- <script type="text/javascript" src="../../../dojo/dojo.js"
- djConfig="isDebug: true, debugAtAllCosts: false, parseOnLoad: true"></script>
- <script type="text/javascript">
- dojo.require("dojox.grid.Grid");
- dojo.require("dojox.data.CsvStore");
- dojo.require("dojo.data.ItemFileWriteStore");
- dojo.require("dojo.parser");
- </script>
- <script type="text/javascript">
- function getRow(inRowIndex){
- return ' ' + inRowIndex;
- }
-
- var iEditor = dojox.grid.editors.Input;
- var layoutMovies = [
- // view 0
- { type: 'dojox.GridRowView', width: '20px' },
- // view 1
- { cells: [[{ name: "Row", get: getRow, width: 5}]], noscroll: true},
- // view 2
- { cells: [[
- { field: "Title", editor: iEditor, width: 'auto' },
- { field: "Year", editor: iEditor, width: 5 },
- { field: "Producer", editor: iEditor, width: 20 }
- ]]}
- ];
-
- var layoutCountries = [
- // view 0
- { type: 'dojox.GridRowView', width: '20px' },
- // view 1
- { cells: [[{ name: "Row", get: getRow, width: 5}]], noscroll: true},
- // view 2
- { cells: [[
- { field: "name", name: "Name", width: 'auto' },
- { field: "type", name: "Type", editor: iEditor, width: 'auto' },
- ]]}
- ];
- </script>
-</head>
-<body class="tundra">
- <h1>dojox.Grid using Dojo.Data stores via simple binding</h1>
- <!--
- <br>
- <span dojoType="dojox.data.CsvStore"
- jsId="csvStore" url="support/movies.csv">
- </span>
- <span dojoType="dojox.grid.data.DojoData"
- jsId="dataModel"
- store="csvStore"
- rowsPerPage="5"
- query="{ Title: '*' }"
- clientSort="true">
- </span>
- <div id="grid" dojoType="dojox.Grid" elasticView="2"
- model="dataModel" structure="layoutMovies">
- </div>
- -->
- <br>
- <h3>Update some of the types</h3>
- <button onclick="updateCountryTypes();">Go!</button>
- <script>
- function updateCountryTypes(){
- // get everything starting with "A"
- jsonStore.fetch({
- query: { name: "A*" },
- onComplete: function(items, result){
- // change 'em!
- dojo.forEach(items, function(item){
- jsonStore.setValue(item, "type", "thinger");
- // console.debug(item);
- });
- }
- });
- }
- </script>
-
- <span dojoType="dojo.data.ItemFileWriteStore"
- jsId="jsonStore" url="../../../dijit/tests/_data/countries.json">
- </span>
- <span dojoType="dojox.grid.data.DojoData"
- jsId="dataModel2"
- rowsPerPage="20"
- store="jsonStore"
- clientSort="true"
- query="{ name : '*' }">
- </span>
- <div id="grid2" dojoType="dojox.Grid" elasticView="2"
- model="dataModel2" structure="layoutCountries">
- </div>
-
- <div id="grid3" dojoType="dojox.Grid" elasticView="2"
- model="dataModel2" structure="layoutCountries">
- </div>
-</body>
-</html>
projects / eow / blobdiff