Как по событию .submit отловить нажатую button? [дубликат]

171

24 сентября 2019, 03:10

Данный вопрос является точным дубликатом:

Как отследить инициатора события submit из обработчика в javascript (на стороне клиента, без отправки формы)? 1 ответ

Есть форма с двумя кнопками.

<form>
  <!-- поля формы -->
  <button type="submit"></button>
  <button type="submit" name="printing"></button>
</form>

Так устроена логика, что name на сервер не приходит и определить по нему какая копка нажата не получится (на сервере).
Но в js есть обработка отправки формы на сервер, поэтому хочу разместить немного логики там.
Внутри формы

_this.submit (event) ->
        event.preventDefault()
        //.......
        // здесь отлавливаю кнопку, которая нажата и ее атрибуты
 $.post $(this).attr('action')
        , $(this).serialize() + printing
        , (data) ->
        //.......

Как определить какая кнопка нажата? и получить ее атрибуты

Answer 1

без jQuery можно реализовать так: уже что именно от кнопки отправлять - решать самому.. адрес отправки тоже.

const  form  = document.querySelector('#form') 
const request = new XMLHttpRequest(); 
 
document.querySelectorAll('.submit').forEach(item=>{ 
  item.addEventListener('click',(ev)=>{ 
  const  formData = new FormData(form) 
  ev.preventDefault(); 
  const button = ev.target; 
  request.open("POST", "http://example.com"); 
  formData.append('action',button.getAttribute('action')) 
  request.send(formData); 
})})

<form id = "form"> 
  <input type = "text" name= 'text'/> 
  <input class = 'submit' action = "print" id = "1" type="submit"/> 
  <input class = 'submit' action = "show"   id = "2" type="submit"/> 
</form>