• Un au hasard
  • Site officiel
  • Contact
  • FAQ

    Comment gérer les checkbox multiple non envoyées en POST ?

    ⌚ 2014-02-21 > Aucun commentaire

    C'est un cas qui revient assez souvent sur la toile : dans votre formulaire HTML, les cases à cocher ne sont accessibles avec PHP — dans le tableau $_POST — que si elles sont cochées. Il existe des astuces comme ajouté un champ caché, mais dans le cas suivant, ça ne fonctionnera pas (ou la mise en place serait trop fastidieuse).



    Le formulaire


    Imaginons une todolist toute simple en HTML, avec quelques contrôles en JS et le stockage en PHP.
    <form action="." method="post">
        <table summary="Liste des choses à faire">
    <tr>
    <th>Tâche</th>
    <th>Priorité</th>
    <th>Urgent ?</th>
    </tr>
    <tr>
    <td><input type="text" name="tache[]"></td>
    <td><input type="number" name="priorite[]" step="1" min="1" max="5"></td>
    <td><input type="checkbox" name="urgent[]"></td>
    </tr>
    <!-- (...) plusieurs autres lignes telles que la précédente -->
    </table>
    <input type="submit" value="Mettre à jour !">
    </form>

    Dans ce cas là, si j'ajoute 3 choses à faire non urgentes, le tableau $_POST sera rempli tel que :
    Array
    (
    [tache] => Array
    (
    [0] => Faire les courses
    [1] => Corriger bug #2 Shaarlimages
    [2] => S'abonner à MISC
    )
    [priorite] => Array
    (
    [0] => 1
    [1] => 4
    [2] => 2
    )
    )

    Maintenant, je coche urgent pour la tâche n° 2, soit « Corriger bug #2 Shaarlimages ». Voyons ce que ça donne :
    Array
    (
    [urgent] => Array
    (
    [0] => on
    )
    [tache] => Array
    (
    [0] => Faire les courses
    [1] => Corriger bug #2 Shaarlimages
    [2] => S'abonner à MISC
    )
    [priorite] => Array
    (
    [0] => 1
    [1] => 4
    [2] => 2
    )
    )
    DOH ! La tâche n° 1 se retrouve urgente, c'est n'importe quoi !



    La solution


    Lorsque l'on utilise name="tache[]" à la place de name="tache", le tableau $_POST est peuplé d'un tableau contenant les différentes valeurs de tous les champs ayant comme name tache. La premère occurrence sera en tête du tableau. Il y a donc un indice, un curseur, ou appelez ça comme vous voudrez, qui est incrémenté.
    Utilisons ce système à notre avantage alors !

    Lorsque l'utilisateur (dé)chochera une case à cocher, on lui affectera la valeur de sont index dans le tableau. Facile :
    <form action="." method="post">
        <table summary="Liste des choses à faire">
    <tr>
    <th>Tâche</th>
    <th>Priorité</th>
    <th>Urgent ?</th>
    </tr>
    <tr>
    <td><input type="text" name="tache[]"></td>
    <td><input type="number" name="priorite[]" step="1" min="1" max="5"></td>
    <td>
    <input type="checkbox" name="urgent[]"
    onChange="this.value = this.parentNode.parentNode.rowIndex;">
    </td>
    </tr>
    <!-- (...) plusieurs autres lignes telles que la précédente -->
    </table>
    <input type="submit" value="Mettre à jour !">
    </form>
    La fonction rowIndex retourne l'indice de la ligne dans le tableau.

    Dorénavant, voici le contenu du tableau $_POST avec la tâche n° 2 urgente :
    Array
    (
    [urgent] => Array
    (
    [0] => 1
    )
    [tache] => Array
    (
    [0] => Faire les courses
    [1] => Corriger bug #2 Shaarlimages
    [2] => S'abonner à MISC
    )
    [priorite] => Array
    (
    [0] => 1
    [1] => 4
    [2] => 2
    )
    )
    L'ordre du tableau urgent ne compte plus, il contient seulement les indices des cases cochées.

    Et du côté de PHP, pour savoir si une tâche est urgente ou non :
    for ( $i = 0, $len = count($_POST['tache']); $i < $len; ++$i ) {
    $infos[] = array(
    'tache' => $_POST['tache'][$i],
    'priorite' => min(max(1, $_POST['priorite'][$i]+0), 5),
    'urgent' => isset($_POST['urgent']) ? in_array($i, $_POST['urgent']) : false,
    );
    }



    Historique


    • 2015-11-25 : correction d'une faute d'orthographe et meilleur formatage du code.

    L2PHP
    Partagez cet article ☮
    Facebook Google+ Twitter Reddit LinkedIn Courriel


    ☕ Aucun commentaire


    Flux RSS des commentaires de cet article


  Derniers commentaires, vous aussi, apportez votre savoir et questionnez.

  • Loulou sur Mon Macbook Pro ne s'allume plus et la LED du chargeur clignote !
    Bonjour, j'ai exactement le même soucis, sauf que lorsque j…
  • Hadrien.eu sur Améliorez nuit de sommeil et journée de travail grâce à un écran plus reposant
    Pour iOS, il suffit d'attendre iOS 9.3 (ou d'installer la b…
  • Mickaël de JMSinfo sur Améliorez nuit de sommeil et journée de travail grâce à un écran plus reposant
    @drazik : Quelle version d'Ubuntu utilises-tu ? J'ai t…
  • drazik sur Améliorez nuit de sommeil et journée de travail grâce à un écran plus reposant
    Salut, Merci pour l'article ! J'ai voulu teste…
  • Mickaël de JMSinfo sur Mon Macbook Pro ne s'allume plus et la LED du chargeur clignote !
    @Samia : Il n'y a pas de quoi :)

Abonnement au flux RSS

© 2013-2016 JMSinfo SAS, propulsé par BlogoText