gistfile1.txt

<%= form_for(@account_category) do |f| %>
  <% if @account_category.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@account_category.errors.count, "error") %> prohibited this account_category from being saved:</h2>

      <ul>
      <% @account_category.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :name %><br>
    <%= f.text_field :name %>
  </div>

  <div>
	  <%= f.label :company_id %><br />
	  <%= f.collection_select :company_id, Company.all, :id, :name %>
  </div>   
  
  <div>
	  <%= f.label :country_id %><br />
	  <%= f.collection_select :country_id, Country.all, :id, :name %>
  </div> 

<% if false %> 
  <div class="field">
    <%= f.label :data %><br>
    <%= f.text_field :data %>
  </div>
<% end %>  
  
<div class='clearfix attributeContainer'>
  <label class="label" for="account_category_data">Data Attributes</label>
  <div class='row'>
    <p class='span3 underline'>Name</p>
    <p class='span3 underline'>Value</p>
  </div>

  <%= f.fields_for :data, @account_category.data do |d| %>
    <% @account_category.data.try(:each) do |key, value| %>
        <div class="row">
          <p class='span3'>
            <%= text_field_tag key, key, :class => 'text_field dynamicAttributeName' %>
          </p>
          <p class='span3'>
            <%= d.text_field key, :class => 'text_field', :value => value %>
          </p>
          <p class='span1'>
            <a herf='#' class='btn removeRow'>X</a>
          </p>
        </div>
    <% end %>
  <%- end -%>

  <div class='row attributeTemplate <%= 'hide' if @account_category.data.present? %>'>
    <p class='span3'>
      <input class='text_field dynamicAttributeName' id='' name='' placeholder='New Attribute name' size='30' type='text' />
    </p>
    <p class='span3'><input class='text_field' id='bar' name='' placeholder='value' size='30'  type='text'  /></p>
    <p class='span1'><a herf='#' class='btn removeRow'>X</a></p>
  </div>
  <%= link_to 'Add Attribute', '#', :class => 'btn addAttribute btn-primary' %>
</div>


<%= content_for :js do %>
  <script type='text/javascript'>
   $('.attributeContainer').delegate('.dynamicAttributeName', 'keyup', function(event){
     nameElem  = $(this);
     valueElem = nameElem.closest('.row').children('p').children('.text_field')
     value     = nameElem.val().toLowerCase();
     valueElem.attr('id',          'account_category_data_' + value       );
     valueElem.attr('name',        'account_category[data][' + value + ']');
     valueElem.attr('placeholder', 'value for ' + value          );
   })

   $('.attributeContainer').delegate('.removeRow', 'click', function(){
     console.log($(this).closest('.row'))
     $(this).closest('.row').html('');
   })

   $('.addAttribute').on('click', function(){
     contents = "<div class='row'>" + $('.attributeTemplate').html() + '</div>';
     $(this).before(contents);
   })
  </script>
<%- end -%>

  
  
  
  
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>