Форма отправки JavaScript - диалоговое окно подтверждения или отмены отправки - PullRequest
Новая
       14

Форма отправки JavaScript - диалоговое окно подтверждения или отмены отправки

156 голосов
/ 29 июня 2011

Для простой формы с предупреждением, которое спрашивает, были ли поля заполнены правильно, мне нужна функция, которая делает это:

  • Показывает окно предупреждения при нажатии кнопки с двумя вариантами:

    • Если нажать «ОК», форма отправляется
    • Если нажать кнопку «Отмена», окно предупреждения закрывается, и форму можно изменить и отправить повторно

Я думаю, что подтверждение JavaScript будет работать, но я не могу понять, как.

Код, который у меня сейчас есть: 

function show_alert() {
  alert("xxxxxx");
}
<form>
  <input type="image" src="xxx" border="0" name="submit" onclick="show_alert();" alt="PayPal - The safer, easier way to pay online!" value="Submit">
</form>

Ответы [ 5 ]

347 голосов
/ 29 июня 2011

Будет достаточно простого встроенного подтверждения JavaScript : 

<form onsubmit="return confirm('Do you really want to submit the form?');">

Нет необходимости во внешней функции , если вы не выполняете проверку ,что вы можете сделать что-то вроде этого: 

<script>
function validate(form) {

    // validation code here ...


    if(!valid) {
        alert('Please correct the errors in the form!');
        return false;
    }
    else {
        return confirm('Do you really want to submit the form?');
    }
}
</script>
<form onsubmit="return validate(this);">
24 голосов
/ 29 июня 2011 
function show_alert() {
  if(confirm("Do you really want to do this?"))
    document.forms[0].submit();
  else
    return false;
}
19 голосов
/ 29 июня 2011

Вы можете использовать функцию подтверждения JS. 

<form onSubmit="if(!confirm('Is the form filled out correctly?')){return false;}">
  <input type="submit" />
</form>

http://jsfiddle.net/jasongennaro/DBHEz/

1 голос
/ 19 октября 2017

ОК, просто измените свой код на что-то вроде этого: 

<script>
function submit() {
   return confirm('Do you really want to submit the form?');
}
</script>

<form onsubmit="return submit(this);">
   <input type="image" src="xxx" border="0" name="submit" onclick="show_alert();"
      alt="PayPal - The safer, easier way to pay online!" value="Submit">
</form>

Также этот код выполняется, просто я упрощаю видеть, как он работает, просто запускаюкод ниже, чтобы увидеть результат: 

function submitForm() {
  return confirm('Do you really want to submit the form?');
}
<form onsubmit="return submitForm(this);">
  <input type="text" border="0" name="submit" />
  <button value="submit">submit</button>
</form>
0 голосов
/ 03 июля 2019

Если вы хотите применить какое-либо условие при отправке формы, вы можете использовать этот метод 

<form onsubmit="return checkEmpData();" method="post" action="process.html">
  <input type="text" border="0" name="submit" />
  <button value="submit">submit</button>
</form>

Всегда помните, что метод и действие запись атрибута после onsubmit атрибутов

код JavaScript 

function checkEmpData()
{
  var a = 0;

  if(a != 0)
  {
    return confirm("Do you want to generate attendance?");
  }
   else
   {
      alert('Please Select Employee First');
      return false;
   }  
}
...