Trinou
Messages postés2Date d'inscriptionlundi 23 novembre 2009StatutMembreDernière intervention10 août 2010
-
6 août 2010 à 11:03
Trinou
Messages postés2Date d'inscriptionlundi 23 novembre 2009StatutMembreDernière intervention10 août 2010
-
10 août 2010 à 09:18
Bonjour à tous,
Je débute en JS, et je voudrais afficher un array grid. J'ai essayé et cherché mais je n'arrive pas à comprendre ce qui ne va pas dans mon code.
Mon fichier ArrayGrid.js :
Ext.onReady(function(){ //var myData
// NOTE: This is an example showing simple state management. During development,
// it is generally best to disable state management as dynamically-generated ids
// can change across page loads, leading to unpredictable results. The developer
// should ensure that stable state ids are set for stateful components in real apps.
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
// sample static data for the store
var myData = [
...tableau...
];
/**
* Custom function used for column renderer
* @param {Object} val
*/
function change(val){
if(val > 0){
return '' + val + '';
}else if(val < 0){
return '' + val + '';
}
return val;
}
/**
* Custom function used for column renderer
* @param {Object} val
*/
function pctChange(val){
if(val > 0){
return '' + val + '%';
}else if(val < 0){
return '' + val + '%';
}
return val;
}
// create the data store
var store = new Ext.data.ArrayStore({
fields: [
{name: 'ID', type: 'int'},
{name: 'Coucil Chair', type: 'int'},
{name: 'Metric ID', type: 'int'},
{name: 'Root Cause'},
{name: 'Impact'},
{name: 'Target Date', type: 'date', dateFormat: 'n/j h:ia'},
{name: 'Status', type: 'int'},
{name: 'Last update', type: 'date', dateFormat: 'n/j h:ia'},
{name: 'Comment'}
]
});
// manually load local data
store.loadData(myData);
// create the Grid
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'ID',header: 'ID', width: 160, sortable: true, dataIndex: 'ID'},
{header: 'CouncilChair', width: 75, sortable: true, renderer: CouncilChair, dataIndex: 'Council Chair'},
{header: 'Metric ID', width: 75, sortable: true, renderer: Metric ID, dataIndex: 'Metric ID'},
{header: 'Root Cause', width: 75, sortable: true, dataIndex: 'Root Cause'},
{header: 'Impact', width: 160, sortable: true, dataIndex: 'Impact'},
{header: 'Target Date', width: 85, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'Target Date'}
{header: 'Status', width: 75, sortable: true, renderer: Status, dataIndex: 'Status'},
{header: 'Last Updated', width: 85, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'Last Updated'}
{header: 'Comment', width: 75, sortable: true, dataIndex: 'Comment'},
],
stripeRows: true,
autoExpandColumn: 'Impact',
height: 350,
width: 600,
title: 'Array Grid',
// config options for stateful behavior
stateful: true,
stateId: 'grid'
});
// render the grid to the specified div in the page
grid.render('grid');
renderTo: 'grid';
});
Mon fichier Template dans lequel je dois afficher la grid :