property_hire/app/views/admin/property_hires/manage_locations.html.erb

<table class="table main-list">
  <thead>
    <tr class="sort-header">
    <% @table_fields.each do |f| %>
      <%= thead(f) %>
    <% end %>
    </tr>
  </thead>
  <tbody>

  <% @locations.each do |loc| %>
    <tr>
      <td>
      	<a href="#" target="_blank"><%= loc.title %></a>
        <div class="quick-edit">
          <ul class="nav nav-pills">
            <% if can_edit_or_delete?(loc) %>
              <li><a href="<%= edit_location_admin_property_hire_path(loc, :page => params[:page]) %>" data-toggle="modal" data-target="#edit-location-modal"><%= t(:edit) %></a></li>
              <li><a href="<%= destroy_location_admin_property_hire_path(loc, :page => params[:page]) %>" data-method="delete" data-confirm="Are you sure?"><%= t(:delete_) %></a></li>
            <% end %>
          </ul>
        </div>
      </td>
      <td>
        <%= loc.properties.count %>
      </td>
    </tr>
  <% end %>
  </tbody>
</table>
<div id="location-modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="location-modalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="location-modalLabel"><%= t("property_hire.add_location") %></h3>
  </div>
  <div class="modal-body">
  	<div style="text-align: center;">
  		<img src="/assets/spin.gif" alt="">
  	</div>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary" id="add-location-btn">Save</button>
  </div>
</div>
<div id="edit-location-modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="edit-location-modalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="edit-location-modalLabel"><%= t("property_hire.edit_location") %></h3>
  </div>
  <div class="modal-body">
  	<div style="text-align: center;">
  		<img src="/assets/spin.gif" alt="">
  	</div>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary" id="edit-location-btn">Save</button>
  </div>
</div>
<div class="bottomnav clearfix">
	<%= content_tag(:div, paginate(@locations), class: "pagination pagination-centered") %>
	<div class="pull-right">
		<%= link_to t(:add), add_location_admin_property_hires_path, :id=>'create_new_location',  :class => "btn btn-primary", :data => {"toggle" => "modal", "target" => "#location-modal"} %>
	</div>
</div>

<script type="text/javascript">
	$("#add-location-btn").on("click",function(){
		$("#location-modal form").submit();
	})
	$("#edit-location-btn").on("click",function(){
		$("#edit-location-modal form").submit();
	})
  $("#create_new_location").on("click",function(){
    var url = $(this).attr("href");
    $.get(url).done(function(data){
      $("#location-modal .modal-body").html(data);
    })
  })
  $('[data-target="#edit-location-modal"]').on("click",function(){
    var url = $(this).attr("href");
    $.get(url).done(function(data){
      $("#edit-location-modal .modal-body").html(data);
    })
  })
</script>