Запретить запрос GET после запроса POST с использованием AJAX и Flask? [Дубликат]

Многие объяснения уже присутствуют, чтобы объяснить, как это происходит и как это исправить, но вы также должны следовать рекомендациям, чтобы избежать NullPointerException вообще.

См. также: A хороший список лучших практик

Я бы добавил, очень важно, хорошо использовать модификатор final. Использование "окончательной" модификатор, когда это применимо в Java

Сводка:

  1. Используйте модификатор final для обеспечения хорошей инициализации.
  2. Избегайте возврата null в методы, например, при возврате пустых коллекций.
  3. Использовать аннотации @NotNull и @Nullable
  4. Быстрое завершение работы и использование утверждений, чтобы избежать распространения нулевых объектов через все приложение, когда они не должен быть пустым.
  5. Сначала используйте значения с известным объектом: if("knownObject".equals(unknownObject)
  6. Предпочитают valueOf() поверх toString ().
  7. Используйте null safe StringUtils StringUtils.isEmpty(null).

79
задан M_Willett 18 October 2013 в 17:15
поделиться

13 ответов

Вы можете запретить отправку формы с помощью

$("#prospects_form").submit(function(e) {
    e.preventDefault();
});

. Конечно, в функции вы можете проверить пустые поля, и если что-то не выглядит правильным, e.preventDefault() остановит представить.

99
ответ дан Overcode 19 August 2018 в 19:15
поделиться
  • 1
    Для этого метода требуется jQuery. Я думаю, что его всегда лучше практиковать, чтобы предотвратить это с атрибутом типа кнопки. – Vicky Gonsalves 7 September 2015 в 04:53
  • 2
    Этот метод можно сделать без jQuery с чем-то вроде: var form = document.getElementById("myForm"); function handleForm(event) { event.preventDefault(); } form.addEventListener('submit', handleForm); И я понятия не имею, как правильно отформатировать комментарий. – Tynach 6 December 2016 в 22:40
  • 3
    В основном, включите event.preventDefault(); в код обработки отправки формы. Однострочный вариант того, что я добавил в мой другой комментарий (в основном такой же, как версия jQuery), будет: document.getElementById("prospects_form").addEventListener('submit', function(event){event.preventDefault();}); Возможно, есть способ сделать это короче (не используя addEventListener(), но кажется, что это способы о чем-то вообще не одобряется. – Tynach 6 December 2016 в 23:03

Большинство людей не смогут подавать форму, вызывая функцию event.preventDefault() .

Еще одно средство - удалить атрибут onclick кнопки и получить код в processForm() в .submit(function() {, поскольку return false; заставляет форму не отправлять. Кроме того, заставить функции formBlaSubmit() возвращать Boolean на основе действительности, для использования в processForm();

katsh ответ один и тот же, просто легче переварить.

(Кстати, я новичок в stackoverflow, дайте мне указания, пожалуйста.)

4
ответ дан ambrosechua 19 August 2018 в 19:15
поделиться
  • 1
    Хотя хорошо знать, что return false; также останавливает событие от пузырьков DOM - это сокращение для event.preventDefault(); event.stopPropagation(); – Terry 18 October 2013 в 17:51

Для чистого JavaScript используйте метод click вместо

<div id="loginForm">
    <ul class="sign-in-form">
        <li><input type="text" name="username"/></li>
        <li><input type="password" name="password"/></li>
        <li>
            <input type="submit" onclick="loginForm()" value="click" />
        </li>
    </ul>
</div>

<script>
function loginForm() {
    document.getElementById("loginForm").click();
}
</script>

-1
ответ дан Dean Vollebregt 19 August 2018 в 19:15
поделиться

В чистом Javascript используйте: e.preventDefault()

e.preventDefault() используется в jquery, но работает в javascript.

document.querySelector(".buttonclick").addEventListener("click", 
function(e){

  //some code

  e.preventDefault();
})
2
ответ дан Deke 19 August 2018 в 19:15
поделиться

Эта проблема становится более сложной, когда вы даете пользователю 2 возможности отправить форму:

  1. , нажав на специальную кнопку
  2. , нажав клавишу Enter

В таком случае вам понадобится функция, которая обнаруживает нажатую клавишу, в которой вы отправите форму, если была нажата клавиша Enter.

И теперь возникает проблема с IE (в любом случае версия 11) Примечание. Эта проблема не существует с Chrome и с FireFox!

  • Когда вы нажимаете кнопку отправки, форма отправляется один раз; штраф.
  • Когда вы нажмете Enter, форма будет отправлена ​​дважды ... и ваш сервлет будет выполнен дважды. Если у вас нет серверной архитектуры архитектуры PRG (post redirect get), результат может быть неожиданным.

Несмотря на то, что решение выглядит тривиально, для решения этой проблемы потребовалось много часов, поэтому я надеюсь, что это может быть полезно для других людей. Это решение было успешно проверено, в частности, на IE (v 11.0.9600.18426), FF (v 40.03) & amp; Chrome (v 53.02785.143 m 64 бит)

Исходный код HTML & amp; js находятся в фрагменте. Там описан принцип. Предупреждение:

Вы не можете протестировать его в фрагменте, потому что пост-действие не определено и нажатие клавиши Enter может вмешиваться в stackoverflow.

Если вы столкнулся с этой проблемой, а затем просто скопировал / вставил js-код в вашу среду и адаптировал его к вашему контексту.

/*
 * inForm points to the form
 */
var inForm = document.getElementById('idGetUserFrm');
/*
 * IE submits the form twice
 * To avoid this the boolean isSumbitted is:
 *  1) initialized to false when the form is displayed 4 the first time
 * Remark: it is not the same event as "body load"
 */
var isSumbitted = false;

function checkEnter(e) {
  if (e && e.keyCode == 13) {
    inForm.submit();
    /*
      * 2) set to true after the form submission was invoked
      */
    isSumbitted = true;
  }
}
function onSubmit () {
  if (isSumbitted) {
    /*
    * 3) reset to false after the form submission executed
    */
    isSumbitted = false;
    return false;
  }
}
<!DOCTYPE html>
<html>
<body>

<form id="idGetUserFrm" method="post" action="servletOrSomePhp" onsubmit="return onSubmit()">
   First name:<br>
   <input type="text" name="firstname" value="Mickey">
   <input type="submit" value="Submit">
</form>

</body>
</html>

5
ответ дан Mathias Zaja 19 August 2018 в 19:15
поделиться

Просто введите return следующим образом:

function validate()
{

  var username=document.getElementById('username').value;
  
	  if(username=="")
	  {
		return false;	
	  }
	  if(username.length<5&&username.length<15)
	  {
	  	alert("Length should between 5 to 15 characters");
	  	return false;
	  }
	  
	  return true;
}
body{
	padding: 0px;
	margin:0px;
}

input{
	display: block;
	margin-bottom:10px;
	height:25px;
	width:200px;
}

input[type="submit"]{
	margin:auto;
}

label{
	display:block;
	margin-bottom:10px;
}

form{
		width:500px;
		height:500px;
		border:1px solid green;
		padding:10px;
		margin:auto;
		top:0;
		bottom:0;
		left:0;
		right:0;
		position:absolute;		
}

.labels{
	width: 35%;
	box-sizing:border-box;
	display: inline-block;
}

.inputs{
	width: 63%;
	box-sizing:border-box;
	padding:10px;
	display: inline-block;
}
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>FORM VALIDATION</title>
	<link rel="stylesheet" type="text/css" href="style.css">

	<script type="text/javascript" src="script.js"></script>
</head>

<body>
	<form action="#">
		<div class="labels">
			<label>Name</label>
			<label>Email</label>
		</div>

		<div class="inputs">
			<input type="text" name="username" id="username" required>
			<input type="text" name="email" id="email" required>
		</div>
		
		<input type="submit" value="submit" onclick="return validate();">
	</form>
</body>

</html>

Вернуть true и false из validate (); функция согласно требованию

-2
ответ дан Mohd Jahid 19 August 2018 в 19:15
поделиться
  • 1
    вам лучше дать подсказку или предоставить фрагмент кода вместо этого большого фрагмента кода – Felix Geenen 22 June 2016 в 17:26
  • 2
    Не работает для отправки, нажав Enter. – Code Whisperer 27 August 2016 в 18:54

Если вы хотите использовать Pure Javascript, следующий фрагмент будет лучше, чем что-либо еще.

Предположим :

HTML:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Form Without Submiting With Pure JS</title>
        <script type="text/javascript">
            window.onload = function(){
                /**
                 * Just Make sure to return false so that your request will not go the server script
                 */
                document.getElementById('simple_form').onsubmit = function(){
                    // After doing your logic that you want to do 

                    return false 
                }
            }
        </script>
    </head>
    <body>

    </body>
</html>
<form id="simple_form" method="post">
    <!-- Your Inputs will go here  -->
    <input type="submit" value="Submit Me!!" />
</form>

Надеюсь, это сработает для вас !!

0
ответ дан Mr. Suryaa Jha 19 August 2018 в 19:15
поделиться

Вы можете использовать этот код для отправки формы без обновления страницы. Я сделал это в своем проекте.

$(function () {
    $('#myFormName').on('submit',function (e) {

              $.ajax({
                type: 'post',
                url: 'myPageName.php',
                data: $('#myFormName').serialize(),
                success: function () {
                 alert("Email has been sent!");
                }
              });
          e.preventDefault();
        });
});
9
ответ дан safeer008 19 August 2018 в 19:15
поделиться

Лично мне нравится проверять форму на submit и, если есть ошибки, просто верните false.

$('form').submit(function() {

    var error;

   if ( !$('input').val() ) {
        error = true
    }

    if (error) {
         alert('there are errors')
         return false
    }

});

http://jsfiddle.net/dfyXY/

3
ответ дан sqram 19 August 2018 в 19:15
поделиться

Добавьте этот код onsubmit = "return false":

<form name="formname" onsubmit="return false">

Это исправило это для меня. Он все равно будет запускать функцию onClick, которую вы укажете

42
ответ дан user3413723 19 August 2018 в 19:15
поделиться
  • 1
    И он все равно будет проверять форму браузера HTML5. – Daniel Sokolowski 3 April 2017 в 18:30
  • 2
    Нет необходимости в libs, в этом случае jquery - потрясающий родной. – calbertts 22 August 2017 в 10:56
  • 3
    Это самое простое решение без JQuery. Кроме того, вы также можете использовать его как; onsubmit = "return submitFoo () & quot; и возвращает false в submitFoo (), если вам нужно вызвать функцию для отправки. – bmkorkut 15 March 2018 в 14:06
  • 4
    но он никогда не позволит подавать форму. – Arun Raaj 16 June 2018 в 07:30

Заменить тип кнопки на button:

<button type="button">My Cool Button</button>
54
ответ дан Vicky Gonsalves 19 August 2018 в 19:15
поделиться
  • 1
    Это единственный метод, который предотвращает обновление страницы, даже если есть ошибка Javascript, которая может быть полезна для тестирования и разработки. – jjz 30 April 2014 в 20:47
  • 2
    Это полезно, но не препятствует отправке / перезагрузке, когда пользователь нажимает [Enter]. – System.Cats.Lol 26 March 2016 в 01:53
  • 3
    @ System.Cats.Lol Согласитесь с вами, но OP хотел предотвратить его при нажатии клавиши. – Vicky Gonsalves 28 March 2016 в 13:15
  • 4
    не подходит для проверки формы: / вам нужна кнопка отправки в элементе формы – RomOne 7 June 2017 в 05:20
function ajax_form(selector, obj)
{

    var form = document.querySelectorAll(selector);

    if(obj)
    {

        var before = obj.before ? obj.before : function(){return true;};

        var $success = obj.success ? obj.success: function(){return true;};

        for (var i = 0; i < form.length; i++)
        {

            var url = form[i].hasAttribute('action') ? form[i].getAttribute('action') : window.location;

            var $form = form[i];

            form[i].submit = function()
            {

                var xhttp = new XMLHttpRequest();

                xhttp.open("POST", url, true);

                var FD = new FormData($form);

                /** prevent submiting twice */
                if($form.disable === true)

                    return this;

                $form.disable = true;

                if(before() === false)

                    return;

                xhttp.addEventListener('load', function()
                {

                    $form.disable = false;

                    return $success(JSON.parse(this.response));

                });

                xhttp.send(FD);

            }
        }
    }

    return form;
}

Не проверял, как это работает. Вы также можете привязать (это), чтобы он работал как jquery ajaxForm

, используя его как:

ajax_form('form',
{
    before: function()
    {
        alert('submiting form');
        // if return false form shouldn't be submitted
    },
    success:function(data)
    {
        console.log(data)
    }
}
)[0].submit();

он возвращает узлы, чтобы вы могли сделать что-то вроде submit i выше примера

до сих пор не совершенствуется, но предполагается, что вы должны работать, вы должны добавить обработку ошибок или удалить условие отключения

0
ответ дан Łukasz Szpak 19 August 2018 в 19:15
поделиться
0
ответ дан Alex 31 October 2018 в 05:31
поделиться
Другие вопросы по тегам:

Похожие вопросы: