Rails Попытка представить форму обмена выпадающего списка

У меня работает Ajax, встроенный Rails javascript, с кнопкой отправки. Однако я бы хотел, чтобы он отправил, когда я изменяю значение раскрывающегося списка и удаляю кнопку. В своем исследовании я нашел то, что выглядит как правильное решение, но я не получаю никакого запроса на сервер. Вот мой код выпадающего списка, обратите внимание, что у него все еще есть кнопка отправки, которая работала до того, как я добавил: onchange:

<% form_tag('switch_car', :method => :put, :remote => true) do %>
  <div class="field">
    <label>Car Name:</label>
    <%= select_tag(:id, options_from_collection_for_select(active_cars, "id", "name"), 
       :onchange => ("$('switch_car').submit()"))%><%= submit_tag "Switch Car" %>
  </div>    
<% end %>

Вот сгенерированный HTML:

<form accept-charset="UTF-8" action="switch_car" data-remote="true" method="post">
  <div style="margin:0;padding:0;display:inline">
    <input name="utf8" type="hidden" value="&#x2713;" />
    <input name="_method" type="hidden" value="put" />
    <input name="authenticity_token" type="hidden" value="PEbdqAoiik37lcoP4+v+dakpYxdpMkSm7Ub8eZpdF9I=" />
  </div>
  <div class="field"> 
    <label>Car Name:</label> 
    <select id="id" name="id" onchange="$('switch_car').submit()">
      <option value="9">Truck</option>
      <option value="10">Car</option>
    </select>
    <input name="commit" type="submit" value="Switch Car" /> 
</div>

Заранее благодарим за любую помощь.

Ответы

Ответ 1

Это то, что я смог сделать, чтобы заставить его работать. Я назвал форму switch_car, используя: name = > "switch_car" и использовал следующий javascript.

:onchange => ("javascript: document.switch_car.submit();")

Я все еще ищу лучший ответ, поэтому я обновлю, если найду что-нибудь. По какой-то причине это не использует submit.js. Он обрабатывает его как HTML в отличие от кнопки отправки, которая использует AJAX для обновления только изменяющихся элементов страницы. Но это лучшее, что я смог найти до сих пор.

Ответ 2

Замените свою замену,

onchange: "this.form.submit();"

Ответ 3

this.form.submit() не будет работать, если форма remote: true и rails-ujs используется. В этом случае вместо XHR будет происходить регулярная отправка.

Вместо этого вы должны:

onchange: 'Rails.fire(this.form, "submit")'

Вы можете прочитать здесь для более подробной информации.

Ответ 4

В зависимости от библиотеки js, которую вы используете:

Прототип: :onchange => ("$('switch_car').submit()")

JQuery: :onchange => ("$('#switch_car').submit()")

Если вы используете настройки по умолчанию, а ваша версия rails ниже 3.1, прототип является библиотекой по умолчанию.

Ответ 5

Более общее решение с использованием jQuery (мне не нужно знать имя формы):

onchange: "$(this).parent('form').submit();"

Ответ 6

Кажется, это уже давно, но я все равно опубликую свои выводы, так как я нигде еще не нашел этого объяснения.

Я сталкивался с этой статьей, которая довольно хорошо описывает, в чем проблема при запуске ajax-запроса через метод submit() (с jQuery или Handler или без него). Затем автор рекомендует сформировать собственный запрос AJAX. Это не требуется и не должно быть сделано для использования логики в rails.js (jquery-jus gem).

Проблемы с вызовом submit() возникают вручную, поскольку rails.js связывает и прослушивает событие в пространстве имен submit.rails. Для ручного запуска отправки используйте

   onchange: 'javascript: $( this ).trigger("submit.rails")'

на элемент или форму.

Ответ 7

Для select_tag просто добавьте:

{:onchange => "myHandler();" }

где ваш обработчик будет:

this.form.submit();

Кроме того, если onchange не работает, вы можете попробовать onChage с капиталом C.

Наконец, убедитесь, что NOT TO CONFUSE select_tag с выбором формы.

См. мой ответ на аналогичный вопрос, только в отношении выбора формы

Добавление события обмена в форму выбора

Ответ 8

Если вы хотите узнать, как ajax подать заявку на изменение полей, вот код.

<%= select_tag(:id, options_from_collection_for_select(active_cars, "id", "name"), 
data: { remote: true, url: your_ajax_route_path }%><%= submit_tag "Switch Car" %>

data: {remote: true, url: your_ajax_route_path}

автоматически отправит ваш вклад в your_ajax_route_path. Если вы используете конструктор форм, вы должны использовать с input_html

input_html: { data: { remote: true, url: your_ajax_route_path } }

как это. Я надеюсь, что это будет полезно для вас

Ответ 9

Ни одно из решений не помогло мне, поэтому я использовал приведенное ниже решение.

$("#q_dimension_id_eq").on("change", function (e) {
        $(this).closest("form").submit();
    });