Question

J'essaie d'utiliser des cases à cocher Dojo (1.3) pour faire apparaître / masquer des colonnes dans une grille Dojo qui est affichée sous les cases à cocher. Cette fonctionnalité fonctionnait bien, mais je souhaitais organiser un peu mieux mes checkBoxes. Alors j'ai essayé de les mettre dans une table. Ma fonction dojo.addOnLoad ressemble à ceci:

dojo.addOnLoad(function(){
    var checkBoxes = [];
    var container = dojo.byId('checkBoxContainer');
    var table = dojo.doc.createElement("table");
    var row1= dojo.doc.createElement("tr");
    var row2= dojo.doc.createElement("tr");
    var row3= dojo.doc.createElement("tr");

    dojo.forEach(grid.layout.cells, function(cell, index){
        //Add a new "td" element to one of the three rows
    });

    dojo.place(addRow, table);
    dojo.place(removeRow, table);
    dojo.place(findReplaceRow, table);

    dojo.place(table, container);
});

Ce qui est frustrant, c'est:

  1. En utilisant le débogueur Dojo, je constate que le code HTML est correctement généré pour la table.
  2. Je peux prendre ce code HTML et ne mettre que la table dans un fichier HTML vide, ce qui rend très bien les cases à cocher dans la table.
  3. La page s'affiche correctement dans Firefox, mais pas dans IE6.

Le code HTML en cours de génération ressemble à ce qui suit:

<div id="checkBoxContainer">
    <table>
        <tr>
            <td>
                <div class="dijitReset dijitInline dijitCheckBox"
                    role="presentation" widgetid="dijit_form_CheckBox_0"
                    wairole="presentation">
                    <input class="dijitReset dijitCheckBoxInput"
                        id="dijit_form_CheckBox_0"
                        tabindex="0" type="checkbox"
                        name="" dojoattachevent=
                        "onmouseover:_onMouse,onmouseout:_onMouse,onclick:_onClick"
                        dojoattachpoint="focusNode" unselectable="on"
                        aria-pressed="false"/>
                </div>
                <label for="dijit_form_CheckBox_0">
                    Column 1
                </label>
            </td>
            <td>
                <div class="dijitReset dijitInline dijitCheckBox"
                    role="presentation" widgetid="dijit_form_CheckBox_1"
                    wairole="presentation">
                    <input class="dijitReset dijitCheckBoxInput"
                        id="dijit_form_CheckBox_1"
                        tabindex="0" type="checkbox"
                        name="" dojoattachevent=
                        "onmouseover:_onMouse,onmouseout:_onMouse,onclick:_onClick"
                        dojoattachpoint="focusNode" unselectable="on"
                        aria-pressed="false"/>
                </div>
            </td>
        </tr>
        <tr>
            ...
        </tr>
    </table>
</div>

J'aurais posté sur les forums officiels du DOJO, mais il est indiqué qu'ils sont obsolètes et qu'ils utilisent maintenant une liste de diffusion. Ils ont dit que si une liste de diffusion ne fonctionnait pas pour vous, utilisez StackOverflow.com. Alors, me voilà!

Était-ce utile?

La solution

Il semble que vous ayez oublié de créer un <tbody> élément.

Autres conseils

J'ai également rencontré ce problème lors de la tentative de génération d'une table à l'aide de dojo dans IE7. Le html est là mais rien n'est rendu. Là encore, la solution consiste à utiliser les balises thead, tbody.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top