Rails - Why jQuery Doesn't Load After Submitting My Form Remotely -

for sake of simplicity, have form updates partial. nothing special there. within partial, have jquery sortable list. before updating form, can drag things around in list without problem.

however, after update list, it's js isn't reloaded , have refresh whole page things rolling again.

i've tried everything, borrowed demo jquery application ryan bates esq. on here. doesn't work either after put js shizzle in partial.

i'm sure it's simple i'm ajax / jquery newbie , struggling.

view:

#test_one   = render "test_one" 

partial "test_one"

= form_for @location, :remote => true |f|   %table     %tr= collection_select(:location, :type_ids, type.all, :id, :name, {:prompt => true}, :multiple => true, :class=>"chzn-select")      %tr        %td          %ul#types.unstyled{"data-update-url" => sort_types_locations_url}            - @types.each |type|              = content_tag_for :li, type                %span.handle                  [drag]                = type.name 

update.js.erb

$("#test_one").html('<%= escape_javascript render("test_two") %>'); 

and in controller:

  def update     @location = location.find(params[:id])     @types = @location.types.order('location_types.position').limit(2)     respond_to |format|       if @location.update_attributes!(params[:location])         flash[:notice] = 'settings updated successfully'         format.html { redirect_to edit_location_path }         format.js       else         format.html { render action: "edit_access" }         format.js { render action: "update_access_errors" }       end     end   end 

and in locations.js.coffee

jquery ->   $('#types').sortable(       axis: 'y'       update: ->         $.post($(this).data('update-url'), $(this).sortable('serialize'))       ) 

the update works, no errors , have nothing in console. lot lost - how can js reload after update record?

the reason is, custom js(about sortable) loaded on document ready, , won't fired again once partial updated.

the solution is: wrap custom js function. call function when document ready , update happens.

# locations.js.coffee $ ->   $(document).custom_js()  $.fn.custom_js ->   $('#types').sortable(     axis: 'y'     update: ->       $.post($(this).data('update-url'), $(this).sortable('serialize'))     )  # update.js.erb $("#test_one").html('<%= escape_javascript render("test_two") %>'); $(document).custom_js(); 

side note custom js function: no need wrap custom codes here, part relating going added/updated ajax.