onunload - Vérifier si le formulaire a été soumis

Question

J'ai un formulaire sur une page Web. Lorsque l'utilisateur quitte cette page, je veux vérifier que le formulaire a été soumis. Si c'était le cas, alors l'utilisateur continue simplement à la page suivante, sinon, l'utilisateur reçoit un message d'alerte et est ramené à la page d'origine où le formulaire réside.

Je ne connais pas trop javascript, donc j'apprécierais que certains extraits de code soient disponibles.

GF

Answer 1

Votre question est un peu vague. Votre question implique que vous soumettez le formulaire de manière asynchrone, mais vous avez dit que vous n'êtes pas familier avec JavaScript. Envoyer un formulaire de manière asynchrone requiert des connaissances JS. En outre, si vous êtes en fait soumettant le formulaire de manière synchrone, la solution aurait été trop évidente (il suffit de rendre certains JS conditionnellement du côté serveur).

Si vous soumettez le formulaire de manière asynchrone, définissez simplement un jeton/basculer en tant qu'attribut data-xxx du formulaire après l'envoi du formulaire. Par exemple.

function submit(form) { 
    // Do your thing to submit it. 

    // And then on succes: 
    form['data-submitted'] = true; 
    return false; 
} 

Puis, au cours beforeunload événement vous suffit de cocher si le jeton/bascule est là et dans le cas où il manque, renvoyer le message en conséquence.

window.onbeforeunload = function() { 
    for (var i = 0; i < document.forms.length; i++) { 
     var form = document.forms[i]; 
     if (form['data-submitted'] != 'undefined' && !form['data-submitted']) { 
      return "There is unsaved data!"; 
     } 
    } 
} 

Notez que vous ne pouvez pas utiliser l'événement unload pour cela car il trop tard pour maintenir la page ouverte.

---

Mise à jour: si le formulaire est soumis de manière synchrone. D'accord, quel que soit le langage côté serveur que vous utilisez, laissez simplement afficher un appel JS window.onbeforeunload lorsque le formulaire n'est pas envoyé (vous savez déjà quand le formulaire a été envoyé, sinon, comment le traiter?)). Vous devez également désactiver l'appel window.onbeforeunload lorsque le formulaire est sur le point d'être envoyé.

Sur la base de l'histoire de votre question, je parie que vous connaissez PHP, voici un exemple de coup d'envoi ciblé PHP:

<?php 
    if (!$form_is_submitted) { 
     echo '<script>window.onbeforeunload = function() { return "There is unsaved data!"; }</script>'; 
     echo '<form onsubmit="window.onbeforeunload=null">'; 
    } 
?>