Jquery ajax call not working within a already rendered partial in Rails -
i´m using great nicolas alpi instructions jquery + rails, application.js is:
jquery.ajaxsetup({ 'beforesend': function(xhr) {xhr.setrequestheader("accept", "text/javascript")} }) function _ajax_request(url, data, callback, type, method) { if (jquery.isfunction(data)) { callback = data; data = {}; } return jquery.ajax({ type: method, url: url, data: data, success: callback, datatype: type }); } jquery.extend({ put: function(url, data, callback, type) { return _ajax_request(url, data, callback, type, 'put'); }, delete_: function(url, data, callback, type) { return _ajax_request(url, data, callback, type, 'delete'); } }); /* submit form ajax use class ajaxform in form declaration <% form_for @comment,:html => {:class => "ajaxform"} |f| -%> */ jquery.fn.submitwithajax = function() { this.unbind('submit', false); this.submit(function() { $.post(this.action, $(this).serialize(), null, "script"); return false; }) return this; }; /* retreive page use class in link declaration <%= link_to 'my link', my_path(),:class => "get" %> */ jquery.fn.getwithajax = function() { this.unbind('click', false); this.click(function() { $.get($(this).attr("href"), $(this).serialize(), null, "script"); return false; }) return this; }; /* post data via html use class post in link declaration <%= link_to 'my link', my_new_path(),:class => "post" %> */ jquery.fn.postwithajax = function() { this.unbind('click', false); this.click(function() { $.post($(this).attr("href"), $(this).serialize(), null, "script"); return false; }) return this; }; /* update/put data via html use class put in link declaration <%= link_to 'my link', my_update_path(data),:class => "put",:method => :put %> */ jquery.fn.putwithajax = function() { this.unbind('click', false); this.click(function() { $.put($(this).attr("href"), $(this).serialize(), null, "script"); return false; }) return this; }; /* delete data use class delete in link declaration <%= link_to 'my link', my_destroy_path(data),:class => "delete",:method => :delete %> */ jquery.fn.deletewithajax = function() { this.removeattr('onclick'); this.unbind('click', false); this.click(function() { $.delete_($(this).attr("href"), $(this).serialize(), null, "script"); return false; }) return this; }; /* ajaxify links on page. function called when page loaded. you'll probaly need call again when write render new datas need ajaxyfied.' */ function ajaxlinks(){ $('.ajaxform').submitwithajax(); $('a.get').getwithajax(); $('a.post').postwithajax(); $('a.put').putwithajax(); $('a.delete').deletewithajax(); } $(document).ready(function() { // non-get requests add authenticity token $(document).ajaxsend(function(event, request, settings) { if (typeof(window.auth_token) == "undefined") return; // ie6 fix http://dev.jquery.com/ticket/3155 if (settings.type == 'get' || settings.type == 'get') return; settings.data = settings.data || ""; settings.data += (settings.data ? "&" : "") + "authenticity_token=" + encodeuricomponent(window.auth_token); }); ajaxlinks(); }); my task controller has:
def followship @task = task.find(params[:id]) respond_to |format| # logic format.js {render :content_type => 'text/javascript' } end end my followship.js.erb:
<% if @new_follower %> $("#followers_list").append("<%= escape_javascript(render :partial => 'new_follower', :object => @new_follower, :locals => {:task => @task}) %>"); $("#_user_id option[value='<%= @new_follower.id.to_s %>']").remove(); $("#follower_<%= @new_follower.id.to_s %>").delay(500).effect("highlight", {}, 2000); <% else %> $("#follower_<%= @id_to_remove %>").fadeout("slow"); <% end %> <% flash.discard %> the _new_follower.erb partial:
<li id='follower_<%= @new_follower.id.to_s %>'> <%= @new_follower.name %> <%= link_to "[x]", {:controller => "tasks", :action => "followship", :id => @task, :user_id => @new_follower.id, :to_do => "exclude"}, :class => "get" if @new_follower == current_user %> </li> the problem:
when include new follower task, goes ok. new li rendered list , highlight new user. when try exclude myself using [x] link, rendered little partial delivered last ajax call, page reloaded , text of script rendered screen: (e.g.)
$("#follower_2").fadeout("slow"); if reload page , new follower rendered without use of partial, goes ok. fadeout works.
please help. in advance. btw: rails 2.3.8
using approach application.js solved problem:
http://www.danhawkins.me.uk/2010/05/unobtrusive-javascript-with-rails-2-3-5/
thanks.
Comments
Post a Comment