Discussion :

[Eric Pasquier]

Bonjour,
J'essaye (désespérément) de charger un datagrid contenu dans un onglet qui est lui même chargé dynamiquement.
Je voudrais que l'utilisateur puisse modifier les données présentées ainsi que rajouter des lignes.
J'ai écris le code ci-dessous (extrait) :
- sur l'évênement onRowClick d'un premier datagrid, je charge le contenu de mes onglets (cette partie fonctionne)
- les onglets contiennent des datagrids dont je voudrais charger le contenu dynamiquement.

Pour l'extrait ci-dessous, j'ai placé le storeActions et le contenu du tabActions, mais je le charge en réalité avec un xhrGet.

Mon problème, c'est que je n'arrive pas à recharger le store pour rafraichir le datagrid avec le nouveau contenu. Je suis passé par un datastore pour faire un "save" plus tard.

Merci pour votre aide et suggestions.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
<script type="text/javascript">
 
  var MCurrentId=0;
  var MCurrentItemId=0;
 
  //=============================
  // onTableItemClick
  // Sur clic d'une ligne de la table, mise a jour des onglets
  //-----------------------------
  function onTableItemClick(cell)
  {
  	var item   = cell.grid.getItem(cell.rowIndex);
  	var	id     = this.store.getValue(item, "id");
  	var	itemid = this.store.getValue(item, "ItemId");
 
    MCurrentId      = id;
    MCurrentItemId  = itemid;
 
    //=============================
    // getServerCallback
    // On remplace tout le code HTML du widget
    //-----------------------------
    function getServerCallback(data,ioArgs)
    {
     	//dijit.byId("tabspanel").setContent(data);	
     	dijit.byId("tabactions").setContent(data);	
 
//------------------------------
// Cette partie ne fonctionne pas
//------------------------------
      // Mise a jour du "store" et donc de la grille
      storeActions.fetch({
        url: "<?php echo BASE_URL . '/datastore/getactions/itemid/' ?>" + MCurrentId,
        query: { id: '*' },
        //onComplete: 
        //onError:
      });
    }       
 
    dojo.xhrGet({
      url:     "<?php echo BASE_URL . '/datastore/gettabs ?>",
      load:    getServerCallback,
      //error:   getServerError,
      content: {id: MCurrentId, itemid: MCurrentItemId},
      timeout: 15000
    });
  }
</script>
 
 
 
<!-- Store items -->
<div dojoType="dojo.data.ItemFileWriteStore" jsId="storeItems" url="<?php echo BASE_URL . '/datastore/getitems ?>"></div>
 
<!-- Store actions -->
<div dojoType="dojo.data.ItemFileWriteStore" jsId="storeActions" ></div>
 
<!-- Table des items (en haut) -->
<div dojoType="dijit.layout.ContentPane" splitter="true" region="top" style="height:200px;" sizeMin="50" sizeShare="20">
 
  <!--Table des items-->
	<table id="tableitems" dojoType="dojox.grid.DataGrid" jsId="gridItems" edit="false" selectable="true"
		store="storeItems" query="{id:'0'}" onRowClick="onTableItemClick" >
		<thead>
			<tr>
			  <th field="id" width="20px">Id</th>
			  <th field="ItemId" width="20px">N°</th>
			  <th field="ItemLibelle" width="100%">Description des items</th>
			</tr>
		</thead>
	</table> <!--Table des items-->
</div> <!-- Table des items (en haut) -->
 
 
<!-- Detail d'un item (au centre) -->
<div id="tabspanel" jsId="tabspanel" dojoType="dijit.layout.ContentPane" splitter="true" region="center" sizeMin="50" sizeShare="80">
 
  <div id="tabs" dojoType="dijit.layout.TabContainer" jsId="tabs">
 
Ce contenu est chargé dynamiquement,
placé ici pour l'explication
 
    <div id="tabactions" dojoType="dijit.layout.ContentPane" title="Actions" >
    	<p>Liste des actions :</p>
 
      <table style="height:200px;" id="tableactions" jsId="gridActions" dojoType="dojox.grid.DataGrid" query="{id:'*'}" store="storeActions">
        <thead>
          <tr>
            <th field="id" >Id</th>
            <th field="libelle" >Description</th>
          </tr>
        </thead>
      </table>
    </div>
 
    <div id="tabdocuments" dojoType="dijit.layout.ContentPane" title="Doscuments" >
    	<p>Liste des documents :</p>
    </div>
  </div> <!-- tabs -->
</div> <!-- Detail d'un item (au centre) -->

[emmanuel.remy]

Salut,

Dans ce code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
      storeActions.fetch({
        url: "<?php echo BASE_URL . '/datastore/getactions/itemid/' ?>" + MCurrentId,
        query: { id: '*' },
        //onComplete: 
        //onError:
      });

l'attribut url n'est jamais pris en compte pas cette fonction. Plutôt faire:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
storeActions.attr("url","<?php echo BASE_URL . '/datastore/getactions/itemid/' ?>" + MCurrentId);
 
storeActions.fetch({
        query: { id: '*' },
        //onComplete: 
        //onError:
      });

ERE

[Eric Pasquier]

Je crois que j'avais essayé. J'ai le message suivant :
Error when updating data to the server :TypeError: storeActions.attr is not a function [object Object]

J'ai regardé dans le code, mais je n'ai pas trouvé une autre manière d'initialiser l'url, à part au moment de la création de la classe (variable _jsonFileUrl).

L'autre piste que je suis en train de creuser, c'est la construction du store avec un tableau des valeurs, puis un refresh de la grille en forçant le store :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script "connect on what ?" >dataItems = {
     identifier: 'id', label: 'libelle', items: [
          {id:'1', libelle:'Essai d\'une action'},
          {id:'2', libelle:'Essai d\'une deuxieme action'}
        ]
      };
 
      // Liberation du store precedent : cela fonctionne-t-il ?
      if (storeActions != undefined)
      {
        delete storeActions;
        storeActions=undefined;
      }
 
    storeActions = new dojo.data.ItemFileWriteStore({data: dataItems});
    gridActions.setStore(storeActions);
</script>

Ca marche, mais je n'arrive pas à executer ce script dans la partie chargée dynamiquement, après le xhrGet + setContent, même en exécutant un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

dojo.parser.parse(data);

De plus, je me pose de grosses questions sur les fuites de mémoires des anciennes valeurs du store.

Eric.

[emmanuel.remy]

Je crois que j'avais essayé. J'ai le message suivant :
Error when updating data to the server :TypeError: storeActions.attr is not a function [object Object]

Exact, fais plutôt storeActions.url=.... J'ai été un peu vite en besogne, attr est valable avec les form widget...

J'ai regardé dans le code, mais je n'ai pas trouvé une autre manière d'initialiser l'url qu'au moment de la création de la classe (variable _jsonFileUrl).

Il faut faire attention car de mémoire il y a plusieurs variables concernées: _jsonFileUrl, ccUrl, url ...

ERE

[Eric Pasquier]

Idem : Error when updating data to the server :TypeError: storeActions.url is not a function [object Object]

J'ai complété ma réponse juste au dessus. Sais tu comment je peux exécuter le <script> après le xhrget ?

Eric.

[emmanuel.remy]

avant toute chose, peux tu me passer le code que tu exécutes car là ce n'est pas très normal que tu plantes ainsi.

ERE