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
| Ext.onReady(function(){
Ext.QuickTips.init();
// shorthand alias
var fm = Ext.form;
// the column model has information about grid columns
// dataIndex maps the column to the specific data field in
// the data store (created below)
var cm = new Ext.grid.ColumnModel({
// specify any defaults for each column
defaults: {
sortable: true,
menuDisabled: true
},
columns: [{
id: 'DateOuverture',
header: "Date d\'ouverture",
dataIndex: 'DateOuverture',
width: 120,
renderer: Ext.util.Format.dateRenderer('d-m-Y'),
editor: new fm.DateField({
format: 'd-m-Y',
allowBlank: false, blankText:'Ce champ est obligatoire'})
},{
id: 'HeureOuverture',
header: "Heure d\'ouverture",
dataIndex: 'HeureOuverture',
width: 120,
editor: new fm.TimeField({
format: 'H:i',
allowBlank: false, blankText:'Ce champ est obligatoire'})
},{
id: 'HeureFermeture',
header: "Heure de fermeture",
dataIndex: 'HeureFermeture',
width: 120,
editor: new fm.TimeField({
format: 'H:i',
allowBlank: false, blankText:'Ce champ est obligatoire'})
},{
id: 'Commentaire',
header: "Commentaire",
dataIndex: 'Commentaire',
width: 400,
editor: new fm.TextField()
}]
});
var proxy=new Ext.data.HttpProxy( {url:'readDataCalendrierTP.do'});
var reader=new Ext.data.JsonReader(
{
},[
{name: "DateOuverture", type: 'date', dateFormat: 'Y-m-d'},
{name: "HeureOuverture"}, //, type: 'date', dateFormat: 'H:i'},
{name: "HeureFermeture"}, //, type: 'date', dateFormat: 'H:i'},
{name: "Commentaire"}
]
)
var store=new Ext.data.Store( {
proxy:proxy,
reader:reader,
sortInfo: {field:'DateOuverture', direction:'ASC'}
});
store.load();
// create the editor grid
var grid = new Ext.grid.EditorGridPanel({
store: store,
cm: cm,
renderTo: 'grid-calendrierTP',
width: 800,
height: 300,
enableColumnMove: false, // turn off column reorder drag drop
enableColumnResize: false, // turn off column resize for whole grid
autoExpandColumn: 'Commentaire', // column with this id will be expanded
// title: 'Calendrier des ouvertures TP',
// frame: true, // ???
clicksToEdit: 2,
tbar: [{
text: 'Ajouter une donnée',
handler : function(){
// access the Record constructor through the grid's store
var CalTP = grid.getStore().recordType;
var p = new CalTP({
DateOuverture: '',
HeureOuverture: '',
HeureFermeture: '',
Commentaire: ''
});
grid.stopEditing();
store.insert(0, p);
grid.startEditing(0, 0);
}
}],
buttons: [{
text: 'Mettre à jour',
handler: function() {
// ??????
}
}]
});
}); |
Partager