JQuery Sortable + Rails - Updating an External Model -
i followed railscast episode on creating sortable lists , successful in creating sortable list updates model internally – in application, projects have many steps (the steps nested in projects), , created table sortable steps can access when open project_steps path.
what i'm trying update external model (images) within edit_project_steps path (steps have many images). i'm not sure how extend done in railscast updating external models; when seek sort images within edit_project_steps path, error "actioncontroller::routingerror (no route matches [post] "/projects/1/steps/2/edit")"
would able point me in right direction?
here's have far:
routes.rb
resources :projects resources :steps collection {post :sort} end match "steps/:id" => "steps#number", :as => :number end resources :images collection {post :sort} end
images.rb
class imagescontroller < applicationcontroller # sorts images def sort render nothing: true end end
steps/edit.html.erb
<div class="imagegallery span8"> <p style="margin: 5px 0px;"><b>step images</b> - click , drag rearrange</p> <div class = "wrapper"> <div class="scrolls"> <div class="imagediv" id="stepimages" data-update-url="<%= sort_images_url %>"> <div class="images"> <%= render :partial => 'images/image', :collection => @step.images.all %> </div> <div class="clear"></div> </div> </div> </div> <% #drag images %> <script> $(".imagediv .images").sortable({ cursor: "move", axis: 'x', update: function(){ $.post($(this).data('update-url'), $(this).sortable('serialize')); } }).disableselection(); </script>
rake routes
sort_project_steps post /projects/:project_id/steps/sort(.:format) steps#sort project_steps /projects/:project_id/steps(.:format) steps#index post /projects/:project_id/steps(.:format) steps#create new_project_step /projects/:project_id/steps/new(.:format) steps#new edit_project_step /projects/:project_id/steps/:id/edit(.:format) steps#edit project_step /projects/:project_id/steps/:id(.:format) steps#show set /projects/:project_id/steps/:id(.:format) steps#update delete /projects/:project_id/steps/:id(.:format) steps#destroy project_number /projects/:project_id/steps/:id(.:format) steps#number projects /projects(.:format) projects#index post /projects(.:format) projects#create new_project /projects/new(.:format) projects#new edit_project /projects/:id/edit(.:format) projects#edit project /projects/:id(.:format) projects#show set /projects/:id(.:format) projects#update delete /projects/:id(.:format) projects#destroy sort_images post /images/sort(.:format) images#sort images /images(.:format) images#index post /images(.:format) images#create new_image /images/new(.:format) images#new edit_image /images/:id/edit(.:format) images#edit image /images/:id(.:format) images#show set /images/:id(.:format) images#update delete /images/:id(.:format) images#destroy root / projects#index
here's image of i'm trying sort on page:
it turned out series of issues...here final code interested:
images.rb
def sort params[:image].each_with_index |id, index| image.update_all({position: index+1}, {id: id}) end render nothing: true end
steps/edit.html.erb
<div class="imagegallery span8"> <p style="margin: 5px 0px;"><b>step images</b> - click , drag rearrange</p> <div class = "wrapper"> <div class="scrolls"> <div id="images" data-update-url="<%= sort_images_url %>"> <% @step.images.order("position").each |image| %> <%=content_tag_for(:div, image) %> <%= render :partial => 'images/image', :locals => {:image=> image} %> <% end %> <% end %> </div> </div> </div> <% #drag images %> <script> $("#images").sortable({ cursor: "move", axis: 'x', update: function(){ $.post($(this).data('update-url'), $(this).sortable('serialize')); } }).disableselection(); </script>
ruby-on-rails jquery-sortable
No comments:
Post a Comment