2016-04-07 1 views
0

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

Имея модель с двумя массивами десятичных знаков, весов [] и повторений [], я использовал учебное пособие this, чтобы сделать входную форму для каждого числа в этих массивах отдельно.

Моя проблема: я не знаю, как добавлять/удалять поля из формы с помощью javascript. Автор учебника не поставил никакого кода «потому что это довольно тривиальная задача». Где и как мне нужно поставить javascript для выполнения этих задач?

ответ

0

В отличие от добавления вложенных записей, где вам нужно запрашивать рельсы для создания ассоциированного объекта new, это действительно просто использование javascript для добавления другого ввода. Я бы, вероятно, воспользовался помощью, потому что это сделает ваш просмотр более чистым. Таким образом, вам нужно создать помощника, который строит ваше поле ввода, вызовите этого помощника в вашем представлении, используйте несколько строк javascript, чтобы поместить данные из помощника на страницу, где вы хотите.

Помощник

module ApplicationHelper 
    def link_to_add_weights(name) 
    link_to name, '#', class: "add_weight_fields", :"data-field" => "<input class='text optional' type='text' name='yourmodelname[weights][]' id='yourmodelname_'>" 
    end 
end 

так, что это делает принимает один аргумент, имя, которое вы хотите в ссылке и устанавливает поле ввода в качестве атрибута данных по линии связи, который должен быть создан.

Javascript

$(document).ready(function(){ 
    $(".add_weight_fields").click(function(){ 
    $("#weights").append($(this).data("field")); 
    }); 
}); 

Помощник генерирует ссылку с классом .add_weight_fields так что вы хотите, чтобы вызвать ваш JavaScript, когда эта ссылка нажата. Как только это произойдет, вы просто хотите добавить данные из атрибута data-field, в этом примере я использую css idd весов.

Вид

<%= simple_form_for(@yourmodelname) do |f| %> 
    <%= f.input :repetitions, as: :array %> 
    <div id="weights"> 
    <%= f.input :weights, as: :array %> 
    <%= link_to_add_weights "Add New Weight" %> 
    </div> 
    <div class="actions"> 
    <%= f.submit %> 
    </div> 
<% end %> 

Тогда вы могли бы сделать те же передние повторы. Создайте новый помощник, создайте новый метод js (или вы можете сделать его СУХОЙ и использовать тот же метод для обоих с небольшим условным), и добавьте некоторый идентификатор css в представление для js, чтобы найти вместе с другой ссылкой.