onunload - Проверьте, была ли отправлена ​​форма

Question

У меня есть форма на веб-странице. Когда пользователь переходит с этой страницы, я хочу проверить, что форма была отправлена. Если это так, то пользователь просто переходит на следующую страницу, если нет, пользователь получает сообщение с предупреждением и возвращается на исходную страницу, на которой находится форма.

Я не слишком хорошо знаком с javascript, поэтому я был бы признателен за некоторые фрагменты кода, если это возможно?

GF

Answer 1

Ваш вопрос немного расплывчато. Ваш вопрос подразумевает, что вы отправляете форму асинхронно, но вы сказали, что не знакомы с JavaScript. При отправке формы асинхронно требуется знание JS. Кроме того, если вы фактически, представляя форму синхронно, решение было бы слишком очевидным (просто визуализируйте JS условно на стороне сервера).

Если вы действительно отправляете форму асинхронно, тогда просто установите некоторый токен/переключатель в качестве атрибута формы data-xxx после успешной отправки формы. Например.

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

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

Затем, в течение beforeunload случае вы просто проверить, если маркер/переключатель есть и в случае, если он отсутствует, возвращает соответствующее сообщение.

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!"; 
     } 
    } 
} 

Обратите внимание, что вы не можете использовать unload событие для этого, так как это слишком поздно, то, чтобы держать страницу открытой.

---

Update: поэтому форма представляется синхронно. Хорошо, независимо от того, какой язык на стороне сервера вы используете, просто позвольте ему условно отобразить вызов JS window.onbeforeunload, когда форма не отправлена ​​(вы, очевидно, уже знаете, когда форма была отправлена, как еще вы могли бы ее обработать?;)). Вам также необходимо отключить вызов window.onbeforeunload, когда форма будет отправлена.

Основываясь на истории вопроса Могу поспорить, что вы знаете PHP, так вот PHP целевой пример стартового:

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