Bonjour,
Je cherche a mettre une grid dans mon tab extJs. pour ce faire voici le code que j'ai développer:
fichier html:
<html>
<head>
<title>TabPanel Tutorial</title>
<!-- Ext CSS and Libs -->
<link rel="stylesheet" type="text/css" href="../../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../../ext-all.js"></script>
<script type="text/javascript" src="tab_actions.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" /><!-- LIBS -->
</head>
<body>
<div id="tableau">
<div id="acheteurs" class="x-hide-display">
<div id="acheteurGrid"></div>
</div>
<div id="vendeurs" class="x-hide-display">
World, hello ! o/
</div>
</div>
</body>
</html>
Et maintenant le script ExtJS:
Ext.onReady(function(){
//Le développement d'un tab se fait grâce à Ext.TabPanel:
var tableau = new Ext.TabPanel({
//Lui donné une valeur <div id="..."
renderTo: 'tableau',
//une fois celà fait, nous pouvons définire la frame:
frame: true,
//Puis les dimensions
width: 600,
height: 350,
//Le fait d'être autoScrollable
autoScrollable: true,
//Ensuite nous pouvons définir les items:
items:[
//ContentE1 = <div id="valeur_contentE1">
{
contentE1:'acheteurs',
title:'Clients acheteurs',
autoLoad: loadGrid() },
{
contentE1:'vendeurs',
title:'Clients vendeurs',
autoLoad: {url: 'helloworld.php'}
}
]
});
function loadGrid() { var loadInfo = new Ext.GridPanel({
//url: 'clientAcheteur.xml',
reader: new Ext.data.XmlReader({
record: 'item',
id: 'id'
})
});
var grid = new Ext.grid.GridPanel({
store: loadInfo,
columns: [
{header: "Nom", width: 120, dataIndex:'lastName', sortable: True},
{header: "Prénom", width: 120, dataIndex:'firstName', sortable: True},
],
render-to:'grid', width: 240,
height: 200
});
};
});
Le problème est sur la dernière ligne que je vous ai mis en gras: "render-to:'grid'". Voici l'erreur:
missing : after property id
render-to:'grid',\n
De cette erreur, ma page s'affiche blanche. Mais si j'enlève render-to, Ma grid ne se charge pas dans mon tab. Comment faire alors?
Je vous mets ci-dessous les composants utilisés, histoire que vous ayez une meilleure idée de mon sujet:
le tab:
[ Lien ]
la grid:
[ Lien ]
Meilleures salutations
