Rails / Javascript - render partial is breaking params check - javascript

I have a partial that I'm rendering via javascript:
$('#calendar').html('<%= escape_javascript(render :partial => "schedules/calendar", :locals => {:schedule_tasks => #schedule_tasks}) %>');
and everything works but this one line doesn't work, the params[:day] is in the original URL string:
<%= params[:day] == day.to_s ? 'green':'' %>
Is there something special I need to do to pass in the params[:day]? It's still in the URL.

Related

How to Load a different js file if controller action result is nil

Here is my controller action:
*controller/books_controller.rb*
def search_book
#found_book = Book.find_by_token(params[:token_no])
#once found I am rendering my search_book.js.erb file (with UJS)
respond_to do |format|
format.js
end
end
Here is my js file to alter my html contents : views/books/search_book.js.erb
$("#found_book").html("<%= escape_javascript( render(:partial => "book_view") ) %>");
If my book is successfully found then rendering a partial via UJS.(Done)
Let's say if my book is not found i.e. if #found_book.nil? is true.
In that case I want to render another partial for my div "found_book". How to do that ?
Remember that search_book.js.erb is still erb and thus you can evaluate your instance variable and use a conditional to render the partial you choose.
<%- if #found_book.nil? %>
$("#found_book").html("<%= escape_javascript( render(:partial => "no_book_view") ) %>");
<%- else %>
$("#found_book").html("<%= escape_javascript( render(:partial => "book_view") ) %>");
<% end %>

Passing variable from Rails to js.erb file

This is the code for my side bar. When a user clicks on one of the links, the js.erb file is called, but I don't know how to make the js.erb file be able to differentiate which link the user clicked on. My idea is to use an id, so basically pass the instance variable to the js.erb file. This is how I think it might be done, but I'm not sure at all.
<li>
<%= link_to 'User Details', '/dashboard', :id => 'User Details', remote: true %>
</li>
<li>
<%= link_to 'Projects', '/dashboard', :id => 'Projects', remote: true %>
</li>
There's the js.erb file that's run with this code:
<% if :id == 'User Details' %>
$('#ajax').html("<%= escape_javascript(render :partial => 'users/edit', :locals => { :user => #user } ) %>");
<% elsif :id == 'Projects' %>
$('#ajax').html("<%= escape_javascript(render :partial => 'projects/index', :locals => { :projects => #projects } ) %>");
<% end %>
What am I doing wrong or how should I pass some sort of flag or id to the js.erb file so that I can show the correct information?
I'm not sure if you understand how websites work. Ruby is a server-side language, it is executed and html + js are sent to the web browser. JS files are (in most cases) executed just once on asset compilation/first run and never get updated again.
So there's no way to refer to Ruby code from js on the runtime as you are doing.
Also you're using illegal characters in id attributes, see What characters are allowed in DOM IDs?
Back to ruby/js thing.
You may want to request a partial via ajax, passing an id attribute
$('#ajax').load('<%= here_put_helper_method_to_some_path %>');
And then in ProjectsController#index render what you wish (based on current user for example).
Also - a good rule is to first make things work without ajax and then add ajax calls.

rails jquery ajax request not executing

I am implementing an up-voting system on an app I am building very similar to the one here on stackoverflow. When a user clicks upvote or downvote, an ajax request is sent to one of my controllers which them updates a couple of tables. Once that is done, I use the respond_to to routes to a js.erb file that executes jquery to update the user display. However, the jquery is not being executed. When I lick upvote/downvote, the controller code executes properly (I can see it in the rails console), but the user display is not updated. Upon refresh the user display is updated, however, not asynchronously. I know the jquery is not being executed b/c in the fire bug console I can see my jquery code - it just is not being applied. Here is my upvote controller code:
def upvote
#post = Post.find(params[:id])
#user_vote = current_user.votes.where(post_id: #post.id).first
if #user_vote.blank?
Vote.create(user_id: current_user.id, post_id: #post.id, vote: 1)
#post.upvotes += 1
elsif #user_vote.vote.to_i == 0
#user_vote.vote = 1
#post.upvotes += 1
elsif #user_vote.vote.to_i == 1
return redirect_to :back, :alert => 'You have already upvoted the post'
elsif #user_vote.vote.to_i == 2
#user_vote.vote = 1
#post.downvotes -= 1
#post.upvotes += 1
end
respond_to do |format|
if #post.save and #user_vote.save
format.js { }
else
format.html { redirect_to :back, :alert => 'There was an error in upvoting the post' }
end
end
end
This is my upvote.js.erb file:
$('#post-action-<%= #post.id %>').html("upvote");
// this normally renders a partial (below), but I am rendering "upvote" until I can fix this
// escape_javascript(<%= render :partial => 'post_voting', :locals => { post: #post, user_vote: #user_vote } %>)
Here is my html:
<div class="post_actions" id='post-action-<%= "#{post.id}" %>' >
<%= render :partial => 'post_voting', :locals => { post: post, user_vote: current_user.votes.where( post_id: post.id ).first } %>
</div>
Here is my firebug console output: http://i.imgur.com/H6zXJ.png
EDIT
I noticed I am getting an error in on my server:
Started GET "/assets/bootstrap.js?body=1" for 127.0.0.1 at 2012-08-09 06:33:42 -0700
Served asset /bootstrap.js - 304 Not Modified (0ms)
Your code seems OK and should execute. You might do an additional check to update a fixed id instead of the calculated id.
$('#updateme').html("upvote");
and add this id in your html somewhere. If this works, you are certain the ajax-call executes completely, and the problem is just the id you are referencing.
Have you checked your html-source that there is an id "post-action-2"?
After messing around with the jquery, I noticed some things. Firstly, I needed to minify my code (taking out all comments and unused spaces). I took this:
$('#post-action-<%= #post.id %>').html("upvote");
// this normally renders a partial (below), but I am rendering "upvote" until I can fix this
// escape_javascript(<%= render :partial => 'post_voting', :locals => { post: #post, user_vote: #user_vote } %>)
and changed it to this:
$('#post-action-<%= #post.id %>').html("upvote");
The code was then working and the user display was updating to show "upvote." Perfect. So then I replaced the above code with this:
$('#post-action-<%= "#{#post.id}" %>').html("<%= escape_javascript(render :partial => 'post_voting', :locals => { :post => #post, :user_vote => #user_vote }) %>");
and KAPOW! It works. So happy to have solved this! MINIFY YOUR JQUERY PEOPLE!

undefined method `formats' when rendering html.erb file

Im using Rails 3.0.3 and ruby 1.8.7
I want to render /materials/change_prize.html.erb in materials/change_prize.js.erb file.
change_prize.js.erb:
$("#content").html("<%= escape_javascript(render(:action => 'materials/change_prize.html.erb')) %>");
Materials Controller:
def change_prize
#material = Material.find(params[:id])
respond_to do |format|
format.js
format.html
end
end
routes.rb:
resources :materials do
member do
get 'change_prize'
post 'change_prize'
end
end
but when i load the js file i get this error:
undefined method `formats' for nil:NilClass
what am i doing wrong?
You need to use :partial not :action
<%= escape_javascript(render :partial => "materials/change_prize", :locals => { :xxxx => #xxxx }) %>
n.b. xxxx is if you need to pass your object to the partial
Partials have to begin with underscore. So rename your filename to "materials/change_prize.html.erb" to "materials/_change_prize.html.erb". Do note however that when calling it thru the render call you refer to the file WITHOUT the underscore.
$("#content").html("<%= escape_javascript(render(:action => 'materials/change_prize.html.erb')) %>");
Filename : app/views/materials/_change_prize.html.erb

Rails 3 Using RJS and having it work in Internet Explorer

I have a rails 3 app that has a fair amount of ajax functionality that is quite complex, it works fine and dandy in every browser but IE, and while I'm not positive why, I'm guessing it has something to do with HTML5. Here are parts of my app (edited for brevity)
in the view:
<li id="category_<%= category.id %>">
<%= link_to "#{category.title}", new_categorization_path(current_user.id, :category_id => category.id), :remote => true %>
</li>
In the controller:
class CategorizationsController < ApplicationController
def new
#category = Category.find(params[:category_id])
#categorization = Categorization.create(:user_id => current_user.id, :category_id => params[:category_id])
render :update do |page|
page.replace_html "category_#{params[:category_id]}", "#{link_to "#{#category.title}", categorization_path(current_user.id, :category_id => #category.id), :method => :delete, :remote => true, :style => "background-color:yellow;"}"
end
end
This code works perfect in all other browsers but IE (using IE8 currently, but I believe it is the same in all versions of IE). In IE it seems to partially work, when I click on it, the link gets a yellow background (as it should), but it doesn't seem to update the HTML at all, when I check the source it seems to have stayed the same, and when I click on the link again nothing happens. Additionally, if I check the DB it doesn't seem to have created a new categorization at all.
What am I missing here? Mime types? Should I put the code in a separate js.erb file?
Thanks!
yo've used double quotes " twice. try this (use ' ustead ")
def new
#category = Category.find(params[:category_id])
#categorization = Categorization.create(:user_id => current_user.id, :category_id => params[:category_id])
render :update do |page|
page.replace_html "category_#{params[:category_id]}", "#{link_to '#{#category.title}', categorization_path(current_user.id, :category_id => #category.id), :method => :delete, :remote => true, :style => "background-color:yellow;"}"
end
end
I ended up doing all my relevant AJAX in a seperate UJS JS file, that seems to have done it.
A la: new.js.erb

Categories