1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>DataGrid Basic Editing</title>
<style type="text/css">
@import "dijit/themes/tundra/tundra.css";
@import "dojox/grid/resources/Grid.css";
@import "dojox/grid/resources/tundraGrid.css";
@import "general.css";
</style>
<script type="text/javascript" src="dojo/dojo.js" djConfig="isDebug:true">
</script>
<!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js"
djConfig="parseOnLoad: true,isDebug:true">
</script>-->
<script type="text/javascript">
dojo.require("dojo.parser");
//dojo.require("dijit.form.Button");
//dojo.require("dijit.Dialog");
//dojo.require("dijit.form.TextBox");
//dojo.require("dijit.form.ValidationTextBox");
//dojo.require("dijit.form.Form");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojox.grid.compat._data.dijitEditors");
dojo.require("dojo.data.ItemFileWriteStore");
// ==========================================================================
// Tie some UI to the data model
// ==========================================================================
//model.observer(this);
modelChange = function(){
dojo.byId("rowCount").innerHTML = 'Row count: ' + dojox.grid.DataGrid.rowCount;
}
// ==========================================================================
// Custom formatters
// ==========================================================================
formatCurrency = function(inDatum){
return isNaN(inDatum) ? '...' : dojo.currency.format(inDatum, this.constraint);
}
formatPercent = function(inDatum){
return isNaN(inDatum) ? '...' : dojo.currency.format(inDatum, this.constraint);
}
formatDate = function(inDatum){
return dojo.date.locale.format(new Date(inDatum), "dd-MMM-yyyy");
}
</script>
<script type="text/javascript">
//http://dojocampus.org/explorer/#Dojox_Grid_Edit%20Dijit
var jsonStore = new dojo.data.ItemFileWriteStore({ url: "json/formatvaltab.json" });
var grid = null;
dojo.addOnLoad(function(){
// set the layout structure:
var layout = [{
rows: [
{ field: 'Date',name: 'Date',width: '100px',
editable: true,
type: dojox.grid.cells._Widget,
cellStyles:"text-align: center;",
constraint: {datePattern:'dd/MM/yy'},
widgetClass:dijit.form.DateTextBox,
widgetProps:{regExp:'^[01-31]/[01-12]/[1-9][1-9][1-9][1-9]$',
invalidMessage:'Votre saisie est incorrecte'}
},
{ field: 'Produit',name: 'Produit',width: '150px'},
{ field: 'Quantite',name: 'Quantite',width: '80px'},
{ field: 'Prix',name: 'Prix',width: '80px',
editable: true,
cellStyles:"text-align: right;",
formatter: formatCurrency,
constraint: {currency: 'EUR'},
required:true,
widgetClass: dijit.form.CurrencyTextBox,
widgetProps:{regExp:'^[0-9]{1,5},[0-9]{1,2}$',
invalidMessage:'Votre saisie est incorrecte'}
},
{ field: 'TVA',name: 'TVA',width: '80px',
editable: true,
type: dojox.grid.cells._Widget,
widgetClass:dijit.form.NumberTextBox,
constraint: {min:0, max:999},
widgetProps:{regExp:'^[0-9]{1,2},[0-9]{1,2}%$',
invalidMessage:'Votre saisie est incorrecte. Le Format de saisie doit être : 99,99',
required:true
}
},
{ field: 'Total',name: 'Total',width: '140px',
editable: true,
cellStyles:"text-align: right;",
formatter: formatCurrency,
constraint: {currency: 'EUR'},
invalidMessage:'Votre saisie est incorrecte',
widgetClass: dijit.form.CurrencyTextBox
}
]
}];
grid = new dojox.grid.DataGrid({
query: { Date: '*' },
store: jsonStore,
structure: layout,
rowsPerPage: 20
}, 'gridNode');
});
</script>
</head>
<body class="tundra">
<h1>Gasket Modification</h1>
<div class="partsContainer">
<div class="gridContainer">
<div id="gridNode"></div>
</div>
</div>
<div id="rowCount"></div>
</body> |
Partager