déclencher le submit d'un formulaire sur check d'un checkbox

**laurentSc** · 29/08/2023, 13h01

Bonjour,
ce que je souhaite faire est mentionné par le titre.
J'ai compris que c'était faisable avec du jQuery, mais n'y suis pas arrivé.

Voici un extrait de mon code :

Code php :

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

1
2
echo '</td><td><input type="checkbox" class="intern-margin" name="update[]" value="'.$one_actu["actu_id"].'" id="update"/></td><td><label for="update">Modifier &nbsp;</label></td>
<td><input type="checkbox" name="delete[]" value="'.$one_actu["actu_id"].' id="delete"/></td><td><label for="delete">Supprimer</label></td>';

S'il manque des informations, merci de me le dire.

**CosmoKnacki** · 29/08/2023, 15h11

J'ai l'impression que tu n'es pas dans le bon forum. Tu peux le faire avec jQuery:

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
<!DOCTYPE html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <script src="lib/jquery-3.7.1.min.js"></script>
    <script>
    $(function() {
        $('input:checkbox').change(function() {
            if ($(this).is(':checked')) $('form').submit();
        });
    });
    </script>    
</head>
<body>
<form method="post" action="">
    <input type="text" name="data" value="Le texte"/>
    <input type="checkbox"/>
</form>
 
<?php if (isset($_POST['data'])): ?>
    <p><?= $_POST['data'] ?></p>
<?php endif ?>
 
</body>
</html>

Mais jQuery n'est pas indispensable (comme toujours):

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
<!DOCTYPE html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <script>
(function() {
    document.addEventListener('DOMContentLoaded', (e) => {
 
        const myForm = document.querySelector('form');
        const myCheckbox = myForm.querySelector('input[type="checkbox"]');
 
        myCheckbox.addEventListener('change', (e) => {
            if (e.target.checked) myForm.submit();
        }, false);
 
    }, false);
})();
    </script>
</head>
<body>
<form method="post" action="">
    <input type="text" name="data" value="Le texte"/>
    <input type="checkbox"/>
</form>
 
<?php if (isset($_POST['data'])): ?>
    <p><?= $_POST['data'] ?></p>
<?php endif ?>
 
</body>
</html>

La chose à retenir, c'est qu'une checkbox n'a pas d'événement "checked". "checked" est un état. Par contre, elle a un événement "change" qui lorsqu'il est écouté, permet de vérifier l'état "checked" dans le handler.

**cavo789** · 29/08/2023, 15h53

Sur un plan purement utilisateur, je ne suis pas certain que c'est une bonne idée.

Cocher / décocher est une action qui ne doit pas impliquer une soumission du formulaire (je pourrais cocher et oups, mauvaise manipulation)

**laurentSc** · 29/08/2023, 16h09

J'ai l'impression que tu n'es pas dans le bon forum.

Même si je pensais que la solution serait du js (jQuery ou pas), le code initial est en PHP, d'où mon post ici.

Sur un plan purement utilisateur, je ne suis pas certain que c'est une bonne idée.

J'envisage de mettre une confirmation : êtes-vous sûr de vouloir supprimer (ou modifier) l'actualité XXX (les 10 premiers caractères du texte) ?

J'essaie les solutions proposées par Cosmo et j'en rends compte...

**laurentSc** · 29/08/2023, 18h18

J'ai pas eu beaucoup de temps pour faire des essais. J'ai cependant essayé en local les 2 scripts de Cosmo et celui avec jQuery ne fonctionne pas ; seul le pur js fonctionne...

**cavo789** · 29/08/2023, 20h11

Envoyé par laurentSc

J'envisage de mettre une confirmation : êtes-vous sûr de vouloir supprimer (ou modifier) l'actualité XXX (les 10 premiers caractères du texte)

Du coup quel est l'intérêt ? Au lieu de cliquer sur submit il faudra cliquer sur Oui je suis sûr. On reste à deux clics du coup pourquoi changer ?

**laurentSc** · 29/08/2023, 21h10

Comme dans tous les cas, il faut une confirmation, si on garde un bouton submit, on a 3 clics au lieu de 2 (1- cocher une checkbox ; 2- bouton submit ; 3-confirmation). Dans mon cas, on a que 2 clics vu qu'on économise l'étape 2.

**laurentSc** · 29/08/2023, 21h53

Comme des 2 scripts du post #2, il n'y a que le second qui fonctionne, j'ai essayé de l'adapter à mon cas : plusieurs checkboxs.

Code php :

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
<!DOCTYPE html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <script>
        (function() {
            document.addEventListener('DOMContentLoaded', (e) => {
 
                const myForm = document.querySelector('form');
                const myCheckbox = myForm.querySelector('input[type="checkbox"]');
 
                myCheckbox.addEventListener('change', (e) => {
                    if (e.target.checked) myForm.submit();
                }, false);
 
            }, false);
        })();
    </script>
</head>
<body>
<form method="post" action="">
    <input type="checkbox" name="data[]" value="Le texte1"/>
    <input type="checkbox" name="data[]" value="Le texte2"/>
</form>
 
<?php if (isset($_POST['data'][0])): ?>
    <p><?= $_POST['data'][0] ?></p>
<?php endif ?>
<?php if (isset($_POST['data'][1])): ?>
<p><?= $_POST['data'][1] ?></p>
<?php endif ?>
<a href="">Close</a> <!-- c'est plus pratique -->
 
</body>
</html>

Mais je n'arrive pas à le mettre au point : si je clique sur la 1e checkbox, OK, on a bien l'affichage de Le texte1. Par contre si je clique sur la seconde, rien et si je clique après sur la première on a affichage

Le texte1 
Le texte2

Peux-tu me corriger ?

Je vais être absent les 2 prochains jours, donc probablement silence radio.

**domi65** · 30/08/2023, 12h05

Envoyé par laurentSc

Comme dans tous les cas, il faut une confirmation

Justement pas. La plupart des formulaires qu'on rencontre sur le web ne demandent pas "Etes-vous sûr de vouloir soumettre ce formulaire" lorsque on clique sur un bouton de soumission, clairement identifié comme tel pour l'internaute.

Ce que tu veux faire ne se rencontre jamais. Pourquoi à ton avis, si c'est une si bonne idée ?

**laurentSc** · 01/09/2023, 12h06

J'ai avancé dans ma réflexion et du coup le titre n'a plus aucun sens ; donc je clos celle-ci et en crée une nouvelle.

déclencher le submit d'un formulaire sur check d'un checkbox

Langage PHP

Discussions similaires

Partager

Partager