Как я могу использовать Javascript для репликации частичной формы по требованию? - PullRequest
0 голосов
/ 07 ноября 2019

Цель - реплицировать раздел формы, чтобы при необходимости можно было сделать несколько записей. Форма загрузки позволит x1 (один) вводить детали. Но если я нажму «Добавить задачу» три раза, форма будет воспроизведена на экране 3 раза, и можно будет сделать 4 записи, дважды щелкнуть форму, чтобы повторить ее дважды, и вы можете ввести еще 2 записи.

Мой вопрос - я новичок в javascript, следую учебному пособию и стал неприкрепленным. Мой код не позволяет мне достичь цели. Как изменить код, чтобы разрешить мне повторять форму при нажатии

У меня нет видимых ошибок, моя страница просто загружается, но ничего не происходит

Дополнительная информация - Не относится квопрос, но я строю свой код на Ruby on Rails

Моя форма - см. раздел между ----, что я хочу, чтобы мой код копировался при клике

    <%= render 'layouts/errors', obj: @category %>
    <p>
      <p>
    <%= simple_form_for(@category) do |f| %>

    <div class='form-group row'>
      <div class='col-sm-8'>
          <%= f.label :name, 'Category : ' %>
      </div>
      <div class="control col-sm-8 mb-4">
        <%= f.text_field :name, class: 'input is-focused form-control', type: 'text', placeholder: 'Job Category Name', autofocus: true  %>
      </div>
    </div>

----this below is the section of my code to replicate --------------------
    <tbody class='fields'>
      <%= f.simple_fields_for :pricings do |builder| %>
      <%= render 'pricing', f: builder %>
      <% end %>
    </tbody>
----this above is the section of my code to replicate -------------------

    <div class='form-group row'>
         <div class='col-md-12 mb-4'>
           <%= f.submit class: 'button is-info is-medium is-fullwidth' %>
           <%= link_to_add_row('Add Task', f, :pricings, class: 'btn btn-primary') %>
         </div>
    </div>

    <% end %>



    <div class='col-xs-4 offset-sm-2'>
       [ <%= link_to 'Return to active listings', @listing %> ]
    </div>

У меня естьпомощник приложения link_to_add_row ()

  def link_to_add_row(name, f, association, **args)
    new_object = f.object.send(association).klass.new
    id = new_object.object_id
    fields = f.simple_fields_for(association, new_object, child_index: id) do |builder|
      render(association.to_s.singularize, f: builder)
    end
    link_to(name, '#', class: "add_fields " + args[:class], data: {id: id, fields: fields.gsub("\n","")})
  end

Наконец, мой код JavaScript, который существует в ресурсах >> javascripts >> application.js

$(document).on('turbolinks:load', function(event) {

  $('form').on('click', '.remove_record', function(event){
    $(this).prev('input[type=hidden]').val('1');
    $(this).closest('tr').hide();
    return event.preventDefault();
  });

  $('form').on('click', '.add_fields', function(event) {
    var regexp, time;
    time = new Date().getTime();
    regexp = new RegExp($(this).data('id'), 'g');
    $('fields').append($(this).data('fields').replace(regexp, time));
    return event.preventDefault();
  });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...