Запретить автоматическое обновление при нажатии кнопки HTML в form_for

Я смешиваю вспомогательную функцию rails form_for с таблицами данных, которая использует собственную кнопку с кодом HTML вне form_for для выбора и отмены выбора записей. Однако, если я нажму кнопку «Выбрать все» поверх таблицы данных, страница автоматически обновится, и любой выбор в таблице будет потерян:

    <%= f.label :call_order %>
    <%= f.check_box :call_order %>

    **Datatables implementation**
    <button id="selectAllRestaurantsForCampaign">Select All</button>
    <button id="deSelectAllRestaurantsForCampaign">Deselect All</button>
    <table id="restaurantsForCampaign" class="display" cellspacing="0" width="100%">
         <... Table Code ...>
    </table> 

    <hr>
    <strong>Campaign Active</strong>

    **Final attribute in form_for**
    <%= f.check_box :is_active %>
    <br>

    <%= f.submit "Save changes", class: "btn btn-large btn-primary" %>

Я хочу, чтобы страница не обновлялась, пока человек не нажмет кнопку отправки form_for внизу страницы:

<%= f.submit "Save changes", class: "btn btn-large btn-primary" %>

Текущий CoffeeScript для кнопок DeSelect и Select All:

 # Conditional 'Select All' (works)
  $("#selectAllRestaurantsForCampaign").click ->
    table.$('tr', {"filter":"applied"}).addClass "selected"

  # Deselecting all (works)
   $("#deSelectAllRestaurantsForCampaign").click ->
    table.$("tr").removeClass "selected"

Как я могу предотвратить обновление страницы до тех пор, пока не будет нажата кнопка отправки?


ruby-on-rails jquery page-refresh form-for jquery-datatables
person Sauron    schedule 01.11.2014    source источник

Ответы (3)


arrow_upward
4
arrow_downward

Если у меня просто есть тег <button></button>, то он фактически действует как отправка, таким образом обновляя страницу.

Что я должен был сделать, так это установить его на <button type="button"></button>, чтобы страница не обновлялась, но по-прежнему позволяла функциям и динамическому контенту работать с отправкой кнопки.

person Sauron    schedule 04.11.2014

arrow_upward
0
arrow_downward

назначьте действие onclick() для кнопки и в application.js создайте функцию с preventdefault, которая остановит отправку,

Когда вы хотите отправить, просто активируйте метод submit()

person iosMessenger    schedule 01.11.2014
comment
Можете ли вы привести пример? - person Sauron; 02.11.2014
comment
Не могли бы вы привести пример? - person Sauron; 02.11.2014

arrow_upward
-1
arrow_downward

Это предотвратит отправку формы SelectAll:

$('#selectAllRestaurantsForCampaign').click(function(e){
     e.preventDefault(); 
    ... your code to select all
});
person markpsmith    schedule 03.11.2014
comment
Вы можете написать это для coffeescript? - person Sauron; 03.11.2014
comment
Это не сработало, все, что он сделал, это запретило кнопкам выполнять какие-либо действия, но все равно обновляло страницу. - person Sauron; 04.11.2014