ruby on rails - Refreshing or updating partials -

so have 2 models. facilities , availability. each facility has many availabilities. on facilities page, have partial lists out availabilities current facility.

i'm trying allow crud operations on availabilities. delete works fine, through ajax , use jquery delete row in table.

i'm having trouble create , update. i'm able them remotely reflecting change without reloading page has stumped.

this partial looks like:

<tbody class="availabilitycontainer">   <% facility_availabilities?.each |a|%>     <tr id="availability_<%= a.id %>">       <td id="date_<%= a.id %>"><%= a.start_time.strftime("%a, %b %d %y") %></td>       <td id="time_<%= a.id %>"><%= a.start_time.strftime("%i:%m  %p") %> - <%= a.end_time.strftime("%i:%m  %p") %></td>       <td id="price_<%= a.id %>"><%= number_to_currency a.price %></td>       <td id="discount_<%= a.id %>"><%= number_to_percentage a.discount, precision: 0 %></td>       <td>           <!-- purchase button -->           <%= link_to("<i class='fa fa-shopping-cart'></i>".html_safe, "#", class:"btn btn-xs btn-success") %>            <!-- edit button -->           <!-- <button type="button" class="btn btn-xs btn-primary" data-toggle="modal" data-target="#editavailability"><i class='fa fa-pencil'></i></button> -->           <%= link_to("<i class='fa fa-pencil'></i>".html_safe, edit_availability_path(a.id) , class:"btn btn-xs btn-primary", data:{toggle:"modal", target:"#editavailability"}, remote: true) %>            <!-- delete button -->           <%= link_to("<i class='fa fa-times'></i>".html_safe, availability_path(a.id), method: :delete, class:"btn btn-xs btn-danger", remote: true) %>       </td>     </tr>     <!-- load edit availability form -->     <div class="modal fade" id="editavailability" tabindex="-1" role="dialog" aria-labelledby="mymodallabel"></div>   <% end %> </tbody> 

i tried things in js:

// hide modal on update $("#editavailability").modal("hide");  // update view $("#availability_<%= @availability.id %>").fadeout(500,function(){     currentitem = $(this)   // new object database (should form i'm committed now)   $.get('/availabilities/<%= @availability.id %>', function (data){     // append new data table or refresh partial somehow   }).done(function() {       // update individual row , fade in?       $("#availability_<%= @availability.id %>").fadein(500)   }) }); 

i think you've mixed 2 different approaches , confused because of it. first approach append row table after pure js request.

$.get("ajax_address", function(data){   $("<tr><td>you new row</td></tr>").appendto("#table_id"); } 

you can chain animation effect appendto, like

$("some").appendto("#table").hide().fadein('slow'); 

second option in more rails way. create link remote: true , write placement logic in js view (pretty same first solution callback function)