Как отключить кнопку отправки формы jquery чтобы форма отправлялась?

Question

[Евгений]

Уже весь мозг съела эта проблема, помогите решить. Объясните тупому, почему не отправляется форма? Нужно чтобы юзер не мог повторно нажать кнопку пока обрабатывается запрос

<form id="moy_form" class="avtozapolnenie" method="POST" action="/test.php">
			<input type="hidden" class="form-control" id="map_lat" name="map_lat" value="315198" placeholder="">
			<input type="hidden" class="form-control" id="map_lon" name="map_lon" value="653646" placeholder="">
				<div class="addafterajax">
				    <h3 class="textafter">Объявление: <span class="copytext"></span></h3>
				    <button type="submit" name="submit" class="createprop" role="button">Создать объявление!</button>
				</div>
		</form>

jQuery(document).ready(function(){
	
jQuery(".createprop").on("click", function(){
	jQuery(".createprop").text("Подождите....!");
	jQuery(".createprop").attr("disabled", "disabled");	  
});
});

Если убираю эту строчку

jQuery(".createprop").attr("disabled", "disabled");

То отправка происходит, но кнопка не блокируется(((

Answer 1

[ThunderCat]

$(document).ready(function(){
  
$("#moy_form").on("submit", function(e){ // событие нужно не клик, а субмит формы
  e.preventDefault(); // останавливаем субмит "вручную"
  $(".createprop").text("Подождите....!"); // делаем хрень
  $(".createprop").attr("disabled", "disabled"); // выключаем кнопку
  $(this).submit(); // субмитим форму "вручную"
});
});

Comments

[Евгений]

Этот код выдает вот такую ошибку в консоли

[Евгений]

Может есть другой способ, запрета повторного нажатия кнопки? Уже задолбался, столько кодов перепробовал, либо кнопка не активна, но форма отправляется, либо наоборот. Но вместе не хочет(((

[Евгений]

Ошибку устранил из консоли, но форма не отправляет запрос(((

[Artem Ivanov]

что то мне подсказывает о древней версии jq

[Евгений]

Artem Ivanov, jq подключается wordpress, версия WP последняя.

[Artem Ivanov]

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

[ThunderCat]

Евгений, В вашем случае я даже не вижу смысла останавливать событие, все работает и так, не вижу проблем

$(document).ready(function(){
  $("#moy_form").on("submit", function(e){ // событие нужно не клик, а субмит формы
  $(".createprop").text("Подождите....!"); // делаем хрень
  $(".createprop").attr("disabled", "disabled"); // выключаем кнопку
   return true;
});
});

[Евгений]

Artem Ivanov, понятно, попробую новую версию jq прицепить. А так уже задолбался с этим кодом, наверно просто вообще спрячу кнопку да и все

[ThunderCat]

Евгений, все работает на практически любой версии, там кода 3 строчки.

[Евгений]

ThunderCat, А вот этот код заработал, спасибо)))

[Евгений]

А не знаете, почему ругается браузер на $, если заменяешь на JQuery все OK?

[Artem Ivanov]

Евгений, значит переменная $ уже занята другой библиотекой , плагином, скриптом

[ThunderCat]

Евгений, есть предположение что у вас 2 раза подключается JQuery, возможно даже разных версий, или версия JQuery очень старая.

Answer 2

[Beliyadm]

Вешаем событие на сабмит
$(document).on('submit', '#myform', function() {
и при успешном ответе блокируем кнопку

$.ajax({
	        success: function(response){
	        $(".createprop").attr("disabled", "disabled");

Answer 3

[Artem Ivanov]

событие неверно как минимум выбрали, нужно явно не онклик ;)

Comments

[Евгений]

А какое лучше выбрать?

[Artem Ivanov]

submit