Zend FR

Consultez la FAQ sur le ZF avant de poster une question

Vous n'êtes pas identifié.

Pages: 1

 

#1 27-10-2009 12:04:32

kkhuet
Membre
Date d'inscription: 25-05-2009
Messages: 13

[ZF 1.9][Dojo 1.3.2] Remplir un tableau

Bonjour,

je cherche à remplir un tableau avec des données d'une BDD. Les colonnes de ce tableau doivent pouvoir être triées. J'ai pensé à Zend_Dojo mais je n'arrive pas à le faire fonctionner. Voici ce que j'ai fait :
- mon contrôleur :

Code:

class EcartController extends Lib_Controller_ActionFactory
{
    public function indexAction()
    {
        $erecharge = new Default_Model_DbTable_Erecharge();
        $dojoData = new Zend_Dojo_Data('id', $erecharge -> fetchAllGroupBy("libelle_boutique='AIX CHABRIER'",'date_vente',null,null,null));
        echo $dojoData -> toJson();
    }
}

- ma classe Bootstrap, dans la méthode _initView() :

Code:

$view -> addHelperPath('Zend/Dojo/View/Helper/', 'Zend_Dojo_View_Helper');
        $view -> dojo() -> setLocalPath(BASE_URL . '/js/dojo/dojo.js')
                        -> addStyleSheetModule('dijit.themes.tundra')
                        -> addStyleSheet(BASE_URL . '/js/dojox/grid/_grid/tundraGrid.css')
                        -> setDjConfigOption('usePlainJson',true)
                        -> setDjConfigOption('parseOnLoad', true)
                        -> requireModule('dojo.data.ItemFileReadStore')
                        -> requireModule('dojox.grid.Grid')
                        -> enable();

- ma vue :

Code:

<span dojoType="dojo.data.ItemFileReadStore" jsId="store" url="ecard/index"></span>
<table dojoType="dojox.grid.Grid" store="store" query="{ date_vente: '*' }" clientSort="true">
    <thead>
        <tr>
        <th field="date_vente">Date vente</th>
        <th field="code_agence">Agence</th>
        <th field="libelle_boutique">Boutique</th>
        </tr>
    </thead>
</table>

Le résultat est un tableau avec les bons noms de colonne et des points d'interrogation à la place des données.
Les données s'affichent sous le tableau et elles sont ce format :

Code:

{ "identifier" : "id",
  "items" : [ { "code_agence" : "ADSUDEST",
        "code_boutique" : "xxxxx",
        "date_echeance" : "2009-01-16",
        "date_injection" : "2009-01-01",
        "date_vente" : "2008-12-27",
      }
   ]
}

j'espère que vous allez pouvoir m'aider, j'ai posté un message sur le forum officiel de Zend et personne ne répond sad

Et si personne n'a la solution, pouvez-vous m'orienter vers un autre moyen d'avoir un tableau dont les colonnes peuvent être triées ? Je pensais à JQuery mais j'y connais rien..

Merci.

Hors ligne

 

#2 28-10-2009 10:08:52

ledahu
Membre
Date d'inscription: 13-03-2008
Messages: 69

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Salut,

Juste une question, pourquoi convertis tu dans ton controller tes infos d'abord en dojo_data puis en json.
Je n'en vois pas l'intérêt car dojo grid prend directement les dojo_data.

Moi j'ai réussi avec ca :

Code:

    public function affemailAction()
    {
        $liste= new Db_NewsletterEmail();
        $data = new Zend_Dojo_Data('LOGIN',$liste->ListEmail($this->_request->getParams()));
        $count=$liste->Count($this->_request->getParam("name"));
        $data->setMetadata('numRows',$count[0]["count"]);
        $data->setMetadata('label','LOGIN');
        $this->_helper->autoCompleteDojo($data);
    }

et dans ma vue

Code:

<?
$this->dojo()->requireModule('dojo.parser')
                ->requireModule('dijit.form.TextBox')
                ->requireModule('dijit.form.ValidationTextBox')
                ->requireModule('dijit.form.Button')
                ->requireModule('dijit.form.Form')
                ->requireModule('dijit.Dialog')
                ->requireModule('dijit.Tooltip')
                ->requireModule('dojox.grid.DataGrid')
                ->requireModule('dojox.data.QueryReadStore')
                ->enable();
?>
<style>
@import "/scripts/dojo/dojox/grid/resources/soriaGrid.css";
</style>
<div id="nav2">
<a href="/" class="gauche">< Retour</a>
</div>
<script type="text/javascript">
var gridLayout = [
    { name: "#", field: "ZEND_DB_ROWNUM", width:3 },
    { name: "Login", field: "LOGIN", width:21 },
    { name: "Email", field: "EMAIL", width:21 },
    { name: "Nom", field: "NOM", width:17 },
    { name: "Prénom", field: "PRENOM", width:11 },
    { name: "Société", field: "SOCIETE", width:18 }
];
var store = null;
dojo.addOnLoad(function() {
    store = new dojox.data.QueryReadStore({
        url:"/newsletter/affemail",
        method:"post"
    });
    grid1.setStore(store);
    grid1.setStructure(gridLayout);
});
var lastSearchValue = "";
function doSearch() {
    if (dijit.byId('search').value!=lastSearchValue) {
        lastSearchValue = dijit.byId('search').value;
        grid1.filter({name:dijit.byId('search').value});
    }
}
function resetSearch() {
    grid1.setStore(store);
}
function getRowData(){
    var items = grid1.selection.getSelected();
    var attr = grid1.store.getAttributes(items[0]);
    affPopup(grid1.store.getValues(items[0],attr[1]));
}
function affPopup(titre) {
    dojo.byId('popup').innerHTML='Chargement...';
    dijit.byId('affpopup').titleNode.innerHTML='Modification de :'+titre;
    dijit.byId('affpopup').show();
    dojo.xhrGet({
        url:"/newsletter/affdetail/LOGIN/"+titre,
        handleAs:"text",
        load: function(response, ioArgs){
            dojo.byId('popup').innerHTML = response;
            return response;
        },
        error: function(reponse, ioArgs){
            dojo.byId('popup').innerHTML = 'Problème :' + response;
            return response;
        }
    });
}
function processForm(){
    dojo.xhrPost({
        url:"/newsletter/affdetail",
        handleAs:"text",
        load: function(response, ioArgs){
            dojo.byId('popup').innerHTML = response;
            return response;
        },
        error: function(reponse, ioArgs){
            dojo.byId('popup').innerHTML = 'Problème :' + response;
            return response;
        },
        form:"form_detailNewsletter"
        });
}
</script>

<br /><br />
<input id="search" type="text" dojotype="dijit.form.TextBox">
<div dojoType="dijit.form.Button" id="btsearch" jsId="btsearch" onClick="doSearch()">Chercher</div>
<div dojoType="dijit.form.Button" id="reset" jsId="reset" onClick="resetSearch()">Reset</div>
    <div dojoType="dojox.grid.DataGrid"
        id="grid1" jsid="grid1"
        store="store"
        query="{ LOGIN: '*' }"
        rowsPerPage="50"
        structure="gridLayout"
        style="height:500px; width:995px;"
        onRowDblClick="getRowData"></div>
<div dojoType="dijit.Dialog" id="affpopup"><div id="popup"></div></div>

J'ai un peu galéré au début avec les grid mais une fois que tu as compris ca fonctionne tout seul.
Modifie mon code avec tes données et ca devrait fonctionner.

Hors ligne

 

#3 28-10-2009 10:34:09

kkhuet
Membre
Date d'inscription: 25-05-2009
Messages: 13

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Bonjour,

j'ai essayé de faire exactement comme toi. Mon contrôleur :

Code:

class EcardController extends Lib_Controller_ActionFactory
{
    public function indexAction()
    {
        $erecharge = new Default_Model_DbTable_Erecharge();
        $dojoData = new Zend_Dojo_Data('id', $erecharge -> fetchAllGroupBy("libelle_boutique='AIX CHABRIER'",'date_vente',null,null,null));
        $this->_helper->autoCompleteDojo($data);
    }
}

et ma vue :

Code:

<script type="text/javascript">
    var gridLayout = [
        { name: "Date vente", field: "date_vente" },
        { name: "Agence", field: "code_agence" },
        { name: "Boutique", field: "libelle_boutique" }
    ];
    var store = null;
    dojo.addOnLoad(function() {
        store = new dojox.data.QueryReadStore({
            url:"/ecard/index",
            method:"post"
        });
        grid.setStore(store);
        grid.setStructure(gridLayout);
    });

</script>

<div dojoType="dojox.grid.DataGrid" id="grid" jsid="grid" store="store" query="{ id: '*' }" rowsPerPage="60" structure="gridLayout"></div>

et lorsque je clique sur le lien menant à la page http://localhost/MonAppli/public/ecard, j'ai directement une boite de dialogue de téléchargement du fichier ecard, qui contient mes données dans ce format :

Code:

{ "identifier" : "id",
  "items" : [ { "code_agence" : "ADSUDEST",
        "code_boutique" : "AL824",
        "code_ean" : "3561292074324",
        "code_magasin" : "810",
        "commentaire" : null,
        "commentaire_plus" : null,
        "date_echeance" : "2009-01-22",
        "date_injection" : "2009-01-07",
        "date_vente" : "2008-12-29",
        "ecart" : "0",
        "ecart_abs" : "0",
        "ecart_traite" : null,
        "id" : "6971034",
        "libelle_agence" : "AD Sud Est",
        "libelle_boutique" : "AIX CHABRIER",
        "produit" : null,
        "qte_pod_sortie" : "2",
        "qte_vegas_retour" : "0",
        "qte_vegas_sortie" : "2",
        "statut" : "1",
        "valeur_abs_ecart" : "0.00",
        "valeur_ecart" : "0.00",
        "valeur_produit" : "10.00",
        "valeur_sortie_pod" : "20.00"
      }, etc ....
   ]
}

bizarre non ? roll

Dernière modification par kkhuet (28-10-2009 10:34:32)

Hors ligne

 

#4 28-10-2009 11:14:36

ledahu
Membre
Date d'inscription: 13-03-2008
Messages: 69

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Non completement normal smile

Je me suis mal expliqué sur un point :
Change ca :

Code:

class EcardController extends Lib_Controller_ActionFactory
{
    public function indexAction()
    {

    }
    public function tableAction()
    {
        $erecharge = new Default_Model_DbTable_Erecharge();
        $dojoData = new Zend_Dojo_Data('id', $erecharge -> fetchAllGroupBy("libelle_boutique='AIX CHABRIER'",'date_vente',null,null,null));
        $this->_helper->autoCompleteDojo($data);
    }
}

et dans ta vue :

Code:

<script type="text/javascript">
    var gridLayout = [
        { name: "Date vente", field: "date_vente" },
        { name: "Agence", field: "code_agence" },
        { name: "Boutique", field: "libelle_boutique" }
    ];
    var store = null;
    dojo.addOnLoad(function() {
        store = new dojox.data.QueryReadStore({
            url:"/ecard/table",
            method:"post"
        });
        grid.setStore(store);
        grid.setStructure(gridLayout);
    });

</script>

<div dojoType="dojox.grid.DataGrid" id="grid" jsid="grid" store="store" query="{ id: '*' }" rowsPerPage="60" structure="gridLayout"></div>

et si tu veux des fonctionnalités avancées dans tes grid ajoute

Code:

        $data->setMetadata('numRows', leTotaldesRéponses );
        $data->setMetadata('label', taClé );

Dernière modification par ledahu (28-10-2009 11:16:52)

Hors ligne

 

#5 28-10-2009 11:46:58

kkhuet
Membre
Date d'inscription: 25-05-2009
Messages: 13

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Cool, ça fonctionne big_smile
Par contre, les données "chevauchent" les noms de colonne...J'ai essayé de changer le style dans ma classe Bootstrap pour pointer vers soriaGrid.css et là, j'ai carrément mes données qui sont hors du tableau.
Et j'ai toujours ces 2 fichus cases à cocher qui s'affichent au dessous de mes deux 1ères colonnes.

Une idée ?

[EDIT] en fait j'obtiens exactement la même chose qu'avec le style tundra (données qui sont par dessus les noms des colonnes), j'avais oublié de changer <body class="tundra"> et addStyleSheetModule('dijit.themes.tundra') :p

Dernière modification par kkhuet (28-10-2009 12:07:58)

Hors ligne

 

#6 28-10-2009 14:43:09

ledahu
Membre
Date d'inscription: 13-03-2008
Messages: 69

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Tu n'as pas une autre css qui change les tables ?

Hors ligne

 

#7 28-10-2009 14:58:58

kkhuet
Membre
Date d'inscription: 25-05-2009
Messages: 13

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

dans la source de ma page, je vois

Code:

<link href="/MonAlibaba/public/css/global.css" media="screen" rel="stylesheet" type="text/css" />        
<style type="text/css">
<!--
    @import "/MonAlibaba/public/js/dijit/themes/tundra/tundra.css";
    @import "/MonAlibaba/public/js/dojox/grid/_grid/tundraGrid.css";
-->
</style>

et dans mon global.css, je ne modifie pas les tables :

Code:

/*------------------- Positionnement -------------------*/
html, body {
    height: 100%;
    font-family: Arial, Helvetica, "MS Sans Serif";
    font-size: 11px;
}

body {
    padding:0;
    margin: 0;
    text-align: left;
}

a img {
    border: none;
}

input {
    padding:0;
    margin:0;
}

#global {
    min-height: 100%;
    width: 900px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}

/***** HEADER *****/
#header {
    padding: 15px 20px 10px 20px;
}

/***** CONTENU *****/
#content {
    padding: 5px 20px;
}

.bloc {
    border: 2px ridge;
    padding: 5px;
}

/***** FOOTER *****/
#footer {
    border-top: dotted 1px #CCCCCC;
}

/***** DIVERS *****/
.centrer {
    text-align: center;
}

.aligne_gauche {
    text-align: left;
}

#boite_flottante_footer {
    position: relative;
    width: 25%;
    float: left;
}

.lien {
    text-align: right;
}

#table_accueil {
    border: 2px ridge;
    border-collapse: collapse;
    margin-top: 2px;
    width: 100%;
}

#table_accueil td {
    border: 2px ridge;
    padding: 5px;
    width: 50%;
}

#login {
    color: #333333;
    font-weight: bold;
    text-align: center;
}

.texteGras {
    font-weight: bold;
}

.texteNormal {
    font-family: Arial, Georgia, Helvetica;
    color: black;
    font-size: 11px;
}

#erreur {
    font-family: "Courier New", Courier, mono;
    font-style: italic;
    background-color: #ee9944;
    font-size: small;
    text-align: center;
}

#boite_flottante .diffusion {
    background-color:#EEEEEE;
}

.petitTexte {
    font-size: .9em;
    color: #999999;
}

.petitTexte a:link, .petitTexte a:visited, .petitTexte a:active {
    text-decoration:none;
    color: #999999;
}

.petitTexte a:hover {
    text-decoration:underline;
    color:#FF6600;
}

.titre {
    background-color: #F8ECDF;
    color: #000;
    padding: 5px;
    font-weight: bold;
    text-align: left;
}

.lien a {
    color: black;
}

.table_color {
    width: 100%;
    border: thin solid #cccccc;
    border-collapse: collapse;
    text-align: center;
}

.table_color th {
    border: thin solid #cccccc;
    background-color: #F8ECDF;
    color: #000;
    padding: 5px;
    font-weight: bold;
}

.table_color td {
    border: thin solid #cccccc;
}

oui je sais il faut encore que je fasse des progrès pour ranger mes css tongue mais là n'est pas le propos ^^

Dernière modification par kkhuet (28-10-2009 14:59:39)

Hors ligne

 

#8 28-10-2009 20:29:37

ledahu
Membre
Date d'inscription: 13-03-2008
Messages: 69

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Je pense que tu n'a pas la bonne css :

@import "/scripts/dojo/dojox/grid/resources/tundraGrid.css";

Tu appelles une css interne la.

Dernière modification par ledahu (28-10-2009 20:29:50)

Hors ligne

 

#9 29-10-2009 09:36:03

kkhuet
Membre
Date d'inscription: 25-05-2009
Messages: 13

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Bonjour,

oui j'ai téléchargé le dojo toolkit en local, et j'ai modifié la couleur du tableau dans mon tundraGrid.css et ça fonctionne.

Une autre idée ? big_smile (au fait j'utilise Firefox 3.0.8 au cas où)

Hors ligne

 

#10 29-10-2009 11:14:14

ledahu
Membre
Date d'inscription: 13-03-2008
Messages: 69

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Salut,

Oui regarde la différence.

La tienne :
@import "/MonAlibaba/public/js/dojox/grid/_grid/tundraGrid.css";

La bonne :
@import "/MonAlibaba/public/js/dojo/dojox/grid/resources/tundraGrid.css";

Je ne pense pas que ce soit la bonne que tu appelles, c'est une css interne à dojo.

Hors ligne

 

#11 29-10-2009 11:23:53

kkhuet
Membre
Date d'inscription: 25-05-2009
Messages: 13

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

ok je valide, merci beaucoup beaucoup smile
mais alors quelle idée d'en mettre plusieurs, on s'y perd là-dedans tongue

Hors ligne

 

#12 11-05-2010 19:08:23

dingamnodjinadji
Nouveau membre
Date d'inscription: 11-05-2010
Messages: 1

Re: [ZF 1.9][Dojo 1.3.2] Remplir un tableau

Bonjour, j'ai le même problème que ledahu pour afficher le datagrid.

lorsque je clique sur le lien menant à la page http://localhost/MonAppli/public/ecard, j'ai directement une boite de dialogue de téléchargement du fichier ecard, qui contient les données.
kkhuet[/] a dit de changer ça

Code:

class EcardController extends Lib_Controller_ActionFactory
{
    public function indexAction()
    {

    }
    public function tableAction()
    {
        $erecharge = new Default_Model_DbTable_Erecharge();
        $dojoData = new Zend_Dojo_Data('id', $erecharge -> fetchAllGroupBy("libelle_boutique='AIX CHABRIER'",'date_vente',null,null,null));
        $this->_helper->autoCompleteDojo($data);
    }
}

et dans la vue

Code:

<script type="text/javascript">
    var gridLayout = [
        { name: "Date vente", field: "date_vente" },
        { name: "Agence", field: "code_agence" },
        { name: "Boutique", field: "libelle_boutique" }
    ];
    var store = null;
    dojo.addOnLoad(function() {
        store = new dojox.data.QueryReadStore({
            url:"/ecard/table",
            method:"post"
        });
        grid.setStore(store);
        grid.setStructure(gridLayout);
    });

</script>

<div dojoType="dojox.grid.DataGrid" id="grid" jsid="grid" store="store" query="{ id: '*' }" rowsPerPage="60" structure="gridLayout"></div>

Ma question est de savoir: s'il faut changer les instructions ci-dessus par quoi?

[b]ledahu peut-tu me dire exactement ce qu'il faut changer dans le code pour que ça marche?
ou y a--il une autre personne qui a compris qui peut expliquer?
Aider moi s'il vous plait ça fait deux semaine que je cherche la solution à ce problème. Merci d'avance

Hors ligne

 

 

Pages: 1

Pied de page des forums

Propulsé par PunBB
© Copyright 2002–2005 Rickard Andersson
Traduction par punbb.fr

Graphisme réalisé par l'agence Rodolphe Eveilleau
Développement par Kitpages