Как создать возможность отправки post запроса из формы через ajax с двумя кнопками?

Question

[Азат Киберов]

Есть следующая форма

<form id="form1" action="" method="POST" >
<input class="val" size="1" type="text" name="text" maxlength="30" value="" autocomplete="off" placeholder="text"  />
	<input type="submit" name="delete" class="btn" value="удалить"/>
	<input type="submit" name="save" class="btn" value="сохранить"/></form>

А вот обработчик ajax

$(document).ready(function () { 
    $("form").submit(function () { 
        // Получение ID формы 
        var formID = $(this).attr('id'); 
        // Добавление решётки к имени ID 
        var formNm = $('#' + formID); 
        $.ajax({ 
            type: "POST", 
            url: 'mail.php', 
            data: formNm.serialize(), 
            success: function (data) { 
                // Вывод текста результата отправки 
                $(formNm).html(data);  
            }, 
            error: function (jqXHR, text, error) { 
                // Вывод текста ошибки отправки 
                $(formNm).html(error);          
            } 
        }); 
        return false; 
    }); 
});

Он работает только с одной кнопкой отправки.
Вот так

<form id="form1" action="" method="POST" >
<input class="val" size="1" type="text" name="text" maxlength="30" value="" autocomplete="off" placeholder="text"  />
	<input type="submit" name="delete" class="btn" value="удалить"/>

А с двумя отказывается как сделать так?

<form id="form1" action="" method="POST" >
<input class="val" size="1" type="text" name="text" maxlength="30" value="" autocomplete="off" placeholder="text"  />
	<input type="submit" name="delete" class="btn" value="удалить"/>
	<input type="submit" name="save" class="btn" value="сохранить"/></form>

А вот php приемник

<?php
if (isset($_POST['save']))
	{
	// сохранено
	}
  else
if (isset($_POST['delete']))
	{
	// удалено
	}
?>

Answer 1

[zoozag]

Обрабатывайте клик по кнопке, вместо сабмита.

var formID = $(this).attr('id'); 
// Добавление решётки к имени ID 
var formNm = $('#' + formID);

$(this) - это уже нужная вам форма форма

Comments

[zoozag]

Азат Киберов, Почему $("form").click?
$(".btn").click, вы же по кнопке кликать будете, а не по форме.

[Азат Киберов]

Я в ajax не сильно разбираюсь можете показать более наглядно.Заранее благодарю.

[Павел Корнилов]

$(".btn").click, вы же по кнопке кликать будете, а не по форме.

Можно и делегирование событий использовать. Даже разумнее все обработчики вешать на форму, а не разбрасывать по узлам.

[Азат Киберов]

Павел Корнилов, Какой код добавить чтобы заработало?Рабочий вариант?

[Павел Корнилов]

<form id="form1" action="" method="POST" >
<input class="val" size="1" type="text" name="text" maxlength="30" value="" autocomplete="off" placeholder="text"  />
  <input type="hidden" name="action" value=""/>
  <input type="submit" name="delete" class="btn" value="удалить"/>
  <input type="submit" name="save" class="btn" value="сохранить"/>
</form>

$("form").on('click'. 'input[type="submit"]', function(e) {
  e.target.action.value = this.value;
});

<?php
if ($_POST['action'] === 'удалить')
  {
  // сохранено
  }
  elseif ($_POST['action'] === 'сохранить')
  {
  // удалено
  }
?>

Как-то так примерно. За точность кода не ручаюсь, писал сразу в редакторе, что не есть айс.

[Азат Киберов]

Павел Корнилов, К сожалению не работает..

[Павел Корнилов]

Азат Киберов, значит смените JS код на:

$("#form1").on('click', 'input[type="submit"]', function(e) {
  this.form.action.value = this.value;
  console.log(this.form.action.value);
});

https://codepen.io/KorniloFF/pen/dabLEp

[Азат Киберов]

И этот не работает..