Discussion :

[cyberlp]

Bonjour,

J'utilise ce script afin d'afficher une alerte javascript et empêcher le submit si la checkbox ('CGU') n'est pas cochée dans un formulaire :

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
<script type="text/javascript">
window.onsubmit = function () {
    var input = document.getElementById('CGU');
    function check() {
        if (input.checked) {
			return true;
        } else {
			alert("La validation de la Charte des rédacteurs est obligatoire");            
           return false; 
        }
    }
    input.onchange = check;
    check();
}
</script>

Le script fonctionne bien, m'affiche l'alerte en cas de non-cochage, par contre le formulaire est quand même validé. Où est se trouve l'erreur ?

Merci !

[javatwister]

"window"???

[SpaceFrog]

onsubmit c'est sur le form ...

[cyberlp]

Je n'y connais pas grand-chose en javascript, donc merci d'éclaircir ce que je dois changer

PS : Sachant que je ne peux pas toucher au formulaire lui-même, car il s'agit d'une fonction ajoutée à une page admin Wordpress (ou alors il faut faire un hook Wordpress, mais cela dépasse mes compétences)

[SpaceFrog]

sans voir le html du form ??

[cyberlp]

Mais il n'y a pas une façon générique d'empêcher un formulaire d'être soumis, en allant simplement vérifier si la checbox 'bidule' est cochée ou non ?
Car mon code fonctionne pour générer l'alerte (il va donc bien vérifier si la case est cochée ou non), c'est juste que le bouton submit n'est pas désactivé en cas de non-cochage.

Voilà la checkbox :

Code :

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

<input id="acf-field-validation_charte" class="checkbox" name="fields[field_557a90bbb8f59][]" value="OK" type="checkbox">

et le submit:

Code :

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

<input name="submit" id="submit" class="button button-primary" value="Mettre à jour le profil" type="submit">

[SpaceFrog]

si au moyen de l'évènement onsubmit DU FORM ...

Code :

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

document.getElementById('ID_DU_FORM').onsubmit = function () {

[cyberlp]

Je viens donc de remplacer par ceci, l'ID du form étant 'your-profile'. Mais ça fait exactement pareil qu'avant :-(

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
<script type="text/javascript">
document.getElementById('your-profile').onsubmit = function () {
    var input = document.getElementById('acf-field-validation_charte');
    function check() {
        if (input.checked) {
			return true;
        } else {
			alert("La validation de la Charte des rédacteurs est obligatoire");            
           return false; 
        }
    }
    input.onchange = check;
    check();
}
</script>

[SpaceFrog]

il est placé ou ton script ?

[AmauriC]

Plus simplement :

Code :

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

1
2
3
document.getElementById('your-profile').onsubmit = function() {
    return document.getElementById('acf-field-validation_charte').checked;
};

https://jsfiddle.net/3by3ey6z/

[cyberlp]

Parfait, ça marche ! Par contre, y a-t-il moyen d'ajouter une alerte JS avec ton code, si Submit est envoyé sans que le case soit cochée ?
Merci.

[AmauriC]

Code :

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

1
2
3
4
5
6
7
8
document.getElementById('your-profile').onsubmit = function() {
    if (document.getElementById('acf-field-validation_charte').checked) {
        return true;
    }
 
    alert('Veuillez lire et accepter la charte');
    return false;
};

[cyberlp]

Impeccable, merci !

[NoSmoking]

Bonjour,

Parfait, ça marche ! Par contre, y a-t-il moyen d'ajouter une alerte JS avec ton code...

et tu cherches quand ?