dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
103 lines (97 loc) • 3.37 kB
HTML
<html>
<head>
<title>Test dojox.grid.DataGrid Editing with large result set</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
<style type="text/css">
@import "../resources/Grid.css";
body {
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 11px;
}
.dojoxGridRowEditing td {
background-color: #F4FFF4;
}
.dojoxGrid input, .dojoxGrid select, .dojoxGrid textarea {
margin: 0;
padding: 0;
border-style: none;
width: 100%;
font-size: 100%;
font-family: inherit;
}
.dojoxGrid input { }
.dojoxGrid select { }
.dojoxGrid textarea { }
#controls {
padding: 6px 0;
}
#grid, #grid2 {
width: 850px;
height: 350px;
border: 1px solid silver;
}
</style>
<script type="text/javascript" src="../../../dojo/dojo.js"
data-dojo-config="isDebug:true, parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dijit.dijit");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dojo.parser");
</script>
<script type="text/javascript" src="support/test_data.js"></script>
<script type="text/javascript">
var layoutNumbers = [
// view 1
{ cells: [ new dojox.grid.cells.RowIndex({width: 5}) ], noscroll: true},
// view 2
[
{ field: 'id', width: 8 },
{ field: 'label', editable: 'true', width: 'auto' }
]
];
removeItem = function() {
// Removes the first item in the store
// Grid should reflect removal of the first item and items should be re-indexed
jsonStore.deleteItem(dataStore.data[0].__dojo_data_item);
}
var i = 0;
addItem = function() {
grid.addRow({name: "country"+(i++), type: "country"});
}
addItemToStore = function() {
// Adds a new item to the store
// Grid should reflect the new item.
jsonStore.newItem({id: "country"+(i++), label: "country"});
}
</script>
</head>
<body class="tundra">
<h2>
dojox.grid.DataGrid Basic Editing test
</h2>
<div id="controls">
<button onclick="grid.render()">Refresh</button>
<button onclick="grid.edit.focusEditor()">Focus Editor</button>
<button onclick="grid.focus.next()">Next Focus</button>
<button onclick="jsonStore.revert()">Revert (Store)</button>
<button onclick="removeItem()">Remove (Store)</button>
<button onclick="addItemToStore()">Add (Store)</button>
<button onclick="grid.removeSelectedRows()">Remove</button>
<button onclick="grid.edit.apply()">Apply</button>
<button onclick="grid.edit.cancel()">Cancel</button>
<button onclick="grid.singleClickEdit = !grid.singleClickEdit">Toggle singleClickEdit</button>
</div>
<span dojoType="dojo.data.ItemFileWriteStore"
data-dojo-id="jsonStore" url="support/numbers.json">
</span>
<div id="grid" data-dojo-id="grid" dojoType="dojox.grid.DataGrid" elasticView="2" query="{ id: '*' }"
rowsPerPage="20" store="jsonStore" structure="layoutNumbers" rowSelector="20px">
</div>
<div id="grid2" data-dojo-id="grid2" dojoType="dojox.grid.DataGrid" elasticView="2" query="{ id: '*' }"
rowsPerPage="20" store="jsonStore" structure="layoutNumbers" rowSelector="20px">
</div>
</body>
</html>