space/app/views/admin/spaces/floors.html.erb

<% content_for :page_specific_css do %>
  <%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
  <%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css" %>
  <%= stylesheet_link_tag "spaces" %>
<% end %>
<% content_for :page_specific_javascript do %>
  <%= javascript_include_tag "lib/jquery.form" %>
  <%= javascript_include_tag "validator" %>
<% end %>
<table class="table main-list table-flat">
  <thead>
    <tr class="sort-header">
      <% @table_fields.each do |f| %>
      <%= thead(f) %>
      <% end %>
    </tr>
  </thead>
  <tbody id="floor-list-table">
	<%= render :partial => "floor", :collection => @building.floors.asc(:title) %>
  </tbody>
</table>
<div class="bottomnav clearfix">
  <div class="action pull-right">
    <a href="#" id="add-floor" class="btn btn-primary"><%= t("space.add_floor") %></a>
  </div>
</div>

<div id="add-floor-modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel"><%= t("spacd.add_floor") %></h3>
  </div>
  <div class="modal-body">
	<form action="/admin/space/add_floor" method="post" id="add-floor-form" class="form-horizontal main-forms" enctype='multipart/form-data'>
		<%= tag(:input, :type => "hidden", :name => request_forgery_protection_token.to_s, :value => form_authenticity_token) %> 
		<div class="control-group">
			<label for="floor-name-text-box" class="control-label muted">Floor Name</label>
	        <div class="controls">
				<input type="text" placeholder="Floor1" id="floor-name-text-box" name="floor[title]" data-fv-validation="required;" data-fv-messages="Cannot be empty;" />
				<input type="hidden" name="building_id" value="<%= @building.id.to_s %>" />
				<input type="hidden" name="floor_id" />
	        </div>
	    </div>
	    <div class="control-group">
			<label for="floor-name-text-box" class="control-label muted">Floor Layout</label>
	        <div class="controls">
				<input type="file" placeholder="Floor1" id="floor-name-text-box" name="floor[layout_image]" />
	        </div>
	    </div>
	     <div class="control-group">
			<label for="floor-name-text-box" class="control-label muted">Frontend Image</label>
	        <div class="controls">
				<input type="file" placeholder="Floor1" id="floor-name-text-box" name="floor[frontend_image]" />
	        </div>
	    </div>
	</form>
  </div>
  <div class="modal-footer">
    <button class="btn btn-primary" id="add-floor-save-btn">Save</button>
  </div>
</div>
<script type="text/javascript">
	var addFloorForm = new FormValidator($("#add-floor-form"));
	$("#add-floor-save-btn").on("click",function() {
		if(addFloorForm.isFormValidated()){
			addFloorForm.form.submit();
		}
	})

	$("#add-floor-modal").on("hidden",function(){
		addFloorForm.reset();
	})

	$("body").on("click",".edit-floor-btns", function(){
		var el = $(this),
			data = el.data("values");
		$("#floor-name-text-box").val(data.title);
		$("input[name=floor_id]").val(data.id);
		addFloorForm.form.attr("action","/admin/space/update_floor");
		$("#add-floor-modal").modal("show");
		return false;
	})

	$("#add-floor").on("click",function(){
		addFloorForm.form.attr("action","/admin/space/add_floor");
		$("#add-floor-modal").modal("show");
	})

	$("body").on("click",".floor-delete-btns", function(){
		var el = $(this);
		if(confirm("Are you sure?")){
			$.ajax({
				url : el.attr("href"),
				type : "delete",
				dataType : "json"
			}).done(function(){
				el.parent().parent().slideUp(function(){
					$(this).remove();
				})
			})
		}
		return false;
	})

</script>