Как динамически добавить новый параметр в набор флажков Formtastic для связанных ресурсов? - PullRequest
Новая
       42

Как динамически добавить новый параметр в набор флажков Formtastic для связанных ресурсов?

1 голос
/ 31 марта 2011

Скажем, у меня есть формальная форма, которая создает Магазин и позволяет выбирать Услуги, которые он предоставляет: 

<%= semantic_form_for @store do |f| %>
  <%= f.inputs :services, :as => :check_boxes, :collection => Service.all %>
  <%= f.buttons %>
<% end -%>

Я хочу разрешить пользователю добавлять новый Сервис, если он не видит его в настройках, прямо из формы.

Есть много примеров простого добавления вложенных элементов формы, скажем, записи Task в Project, и даже драгоценного камня, который помогает с этим , но я не нашел ни одного, который бы создавал новый ресурс поэтому он будет отображаться как флажок или выбранные опции.

1 Ответ

2 голосов
/ 19 июня 2011

Получилось так: 

<%= semantic_form_for @store do |f| %>
  <%= f.inputs :services, :as => :check_boxes, 
                          :collection => Service.all,
                          :wrapper_html => { :id => 'service_fields' } %>  
  <%= f.buttons %>
<% end -%>

Добавлен идентификатор в родительский элемент списка вокруг списка полей флажка, чтобы он мог быть доступен для этого js после отправки текстового поля с новым именем службы: 

<input type="text" id="new_service_name" />
<input type="button" value="ok" id="btnSave" />                                

<script type="text/javascript">        
  $(document).ready(function() {
    $('#btnSave').click(function() {
      $.ajax({
        url: '/admin/services.json',
        type: 'POST',
        dataType: 'json',
        data: 'service[name]=' + $('#new_service_name').val(),
          success: function(data) {
            addCheckbox(data);
          }
        });
      });
    });

    function addCheckbox(name) {
      var container = $('#service_fields fieldset ol');
      var inputs = container.find('input');
      var id = inputs.length+1;

      //var html = '<input type="checkbox" id="cb'+id+'" value="'+name+'" /> <label for="cb'+id+'">'+name+'</label>';
      var html = '<li><label for="store_services_'+id+'"><input id="store_services_'+id+'" name="store[services][]" type="checkbox" value="'+id+'" />'+name+'</label></li>';
      container.append($(html));
    }
</script>

Затем в ServicesController: 

class ServicesController < ApplicationController  
  respond_to :json

  def create
    service = Service.create!(params[:service])    
    respond_with(service)
  end
end
...