С Rails UJS, как отправить удаленную форму из функции

Question

Я использую Rails UJS. У меня есть настройка формы для удаленной отправки, например, так:

<form accept-charset="UTF-8" action="/subscriptions" class="new_subscription form-horizontal" id="new_subscription" data-remote="true" data-type="json" method="POST">

Я пытаюсь найти способ отправить эту форму из функции JavaScript. Я пробовал:

var form$ = $("#new_subscription");
form$.get(0).submit();

но проблема в том, что он отправляет форму без пульта, отправляет сообщение на сервер и обновляет страницу. Есть идеи, почему это так? Есть ли другой способ отправить удаленную форму?

Спасибо

Answer 1

Возможно для тех, кто использует jquery-ujs (Rails 5.0 по умолчанию и ниже), как Михаил, как уже отвечал, будет запускать пользовательское событие jquery, т.е.

$("#new_subscription").trigger("submit.rails");

Для тех, кто наткнулся на этот вопрос в 2017 году и использует Rails 5.1, ответ будет другим. Rails 5.1 упал jquery как зависимость и, следовательно, заменил jquery-ujs с полным переписанным rails-ujs, Смотрите: http://weblog.rubyonrails.org/2017/4/27/Rails-5-1-final/

Таким образом, вам нужно будет запустить соответствующий объект CustomEvent в rails-ujs:

На данный момент, нет опубликованного / рекомендуемого способа сделать это в документации (также известной как RailsGuides), но вот несколько вариантов, которые вы можете использовать, просто взглянув на исходный код Rails:

1. использование Rails.fire функция:

   nativeFormEl = $("#new_subscription")[0] // you need the native DOM element
   Rails.fire(nativeFormEl, 'submit')
   

2. Вы также можете программно вызвать Rails.handleRemote обработчик (тот, который на самом деле представляет формы с data-remote=true через XHR:

   nativeFormEl = $("#new_subscription")[0] // you need the native DOM element
   Rails.handleRemote.call(nativeFormEl, event); // unfortunately, you cannot reference the previously created submit CustomEvent object by rails-ujs.js
   //  ... or ...
   Rails.handleRemote.call(nativeFormEl) // submits via XHR successfully, but throws an error after success callback at Rails.stopPropagation
   

Я предпочитаю вариант 1, потому что это просто оболочка, которая использует более современные методы веб-API, т.е. CustomEvent и отправляет его EventTarget с помощью dispatchEvent,

Answer 2

Попробуйте вызвать submit.rails событие:

$("#new_subscription").trigger("submit.rails");

Answer 3

Попробуйте выполнить запрос Ajax самостоятельно:

$('#new_suscription').submit(function(){
  /*do whatever you want here*/
  $.post('/subscriptions',$(this).serialize(),function(){},'script');
}

Таким образом, вы делаете запрос POST с данными формы и выполняете ответ в виде скрипта.