rails 4, turbolinks 3, partial replacement not working - ruby-on-rails

I'm trying rails/turbolinks 3, and want to make partial replacement work, but no luck with that. Here is code:
gemfile
gem 'turbolinks', github: 'rails/turbolinks' (shows using 3.0.0 so problem not in that, turbolinks included in app..n.js).
router:
root 'home#index'
get '/partial1' => 'home#partial1', as: 'partial1'
get '/partial2' => 'home#partial2', as: 'partial2'
controller
class HomeController < ApplicationController
def index
end
def partial1
render change: 'partial1'
end
def partial2
render change: 'partial2'
end
end
layouts/application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Turbo</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<div>
this is home
<%= link_to("partial asd1", partial1_path) %>
<%= link_to "partial 2", partial2_path%>
</div>
<div id="partial1" data-turbolinks-temporary>
<p>her</p>
</div>
<div id="partial2">
<p>here is partial</p>
</div>
<%= yield %>
</body>
</html>
But it doesn't replace those partials, it works just as regular. I also tried to put turbolinks: true and it renders Turbolinks.replace('some html', {change: ['partial1']}), but also nothing happens. I also tried e.preventDefault and Turbolinks.visit('/partial1', {change: 'partial1'}), and it also not working as well as calling Turbolinks.replace('some html', {change: 'partial1'}). Turbolinks js loads in browser all right. And in dev it shows calling Turbolinks.visit. Tried on different machines.
If anyone made it work please tell me how you did it.

Related

How to access data in rails from a view that was created in the controller?

I am trying to pass an instance variable from the controller to the view. Not sure what I am doing wrong since the view can create an instance and get data. I can also get data in the console. When I inspect the instance instantiated in the controller it is nil. I can't even pass a string. Can anyone spot my error?
Controller tries to set Test. I know its being called because if I delete the line
"render :layout => false" I can see the effects.
class ViewviewerimageController < ApplicationController
def index
render :layout => false
#Test = 'XXX'
end
end
And the view:
<!DOCTYPE HTML>
<html>
<head>
<%= stylesheet_link_tag "ERP" %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<title>Image Data</title>
</head>
<body>
<%= render template: "layouts/header" %>
<%= render template: "layouts/sidebar" %>
<div id="content">
Test = <%= #Test %><br>
inspect = <%= #Test.inspect %><br>
</div>
<%= render template: "layouts/footer" %>
</body>
</html>
And what I get back is:
Test =
inspect = nil
I followed a few different tutorials but it seems they left out something and I can't seem to puzzle it out. I even deleted the CSS and javascript to see if they are interfering but just as I suspected, it wasn't them.
It is because you have the instance variable created after the render is called.
Try doing this
def index
#Test = 'XXX'
render layout: false
end

Bootstrap not working on Heroku app

My rails app is styled with Bootstrap delivered from a CDN. It works fine in development but the styling is lost after uploading to Heroku. I don't have any bootstrap gems in the gemfile. Here is a screen shot of my appplication.html.erb file.
<!DOCTYPE html>
<html>
<head>
<title><%= page_title %></title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>
<body>
<%= render "layouts/header" %>
<%= flash[:notice] %>
<%= flash[:alert] %>
<div id="main">
<%= render "layouts/left_sidebar" %>
<div id="body"><%= yield %></div>
<%= render "layouts/right_sidebar" %>
</div>
</body>
</html>
I am not sure about the info inside the head tags, maybe it is incorrect or should I add a gem? I am not sure what to do. Please help. Thanks in advance.
Not sure if it's causing the problem, but the protocol for one of your Bootstrap links is http and the other is https. You might check your console for load errors.
Since you mentioned the gem, adding this to your Gemfile should do the trick:
gem 'anjlab-bootstrap-rails', '~> 3.0.0.3', :require => 'bootstrap-rails'
I have three apps on Heroku running Bootstrap with this gem and it has never given me any trouble.

Rails 4 TurboLinks not disabling from link in layout

I have a rails 4 project that has some public routes (home, contact, about) and then some routes that are only for logged in users that are name spaced under admin (admin/home, admin/contact, admin/about). The admin routes basically edit and update what is displayed in the public routes.
I have an admin layout for the admin routes and a application layout which does the normal public routes. My admin layout has to have data-no-turbolink in the body because I NEED to disable turbolinks in order for the CKEditor gem to work properly.
Each layout has a link that shows up if a User is logged in. So if a user is logged in and visits "localhost:3000/" or "http://localhost:3000/contact" etc, there will be a link that will link to the admin page.
Likewise if a logged in user visits "http://localhost:3000/admin/home" or "http://localhost:3000/admin/contact" there will be a link that links to the public page. Here is what the layouts look like.
ADMIN LAYOUT
<!DOCTYPE html>
<html>
<head>
<title>TITLE</title>
<script src="//cdn.ckeditor.com/4.4.6/basic/ckeditor.js"></script>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => false %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => false %>
<%= csrf_meta_tags %>
</head>
<body data-no-turbolink>
<div class="page-wrap">
<header id="main-head">
<%= render "nav"%>
</header>
<% if logged_in %>
<div id="review-default"><%= link_to "Preview Pages As A Regular User.", root_path %></div>
<% end %>
<%= yield %>
</div>
</body>
</html>
APPLICATION LAYOUT
<!DOCTYPE html>
<html>
<head>
<title>TITLE</title>
<script src="//cdn.ckeditor.com/4.4.6/basic/ckeditor.js"></script>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<div class="page-wrap">
<header id="main-head">
<%= render "nav"%>
</header>
<% if logged_in %>
<div id="review-admin"><%= link_to "Return to Admin Panel.", admin_home_path %></div>
<% end %>
<%= yield %>
</div>
</body>
</html>
My problem is that when I click from say the root path "/" to "admin/home" the forms that CKEditor is applied to dont display properly until I refresh the page, which leads me to think that they are not displaying properly because turbo links are not disabled.
But when I, for example, log in and get directed to the adminroutes they are disabled. But they dont seem to be when I am linked to them from the links in the layout...
I hope that makes sense.
What am i doing wrong and how do I stop turbo links from being applied to my admin routes?
EDIT
my solution was to add
<% if logged_in %>
<body data-no-turbolink>
<% else %>
<body >
<% end %>
to both my admin and application layouts. This solves my problem, but if anyone has a more elegant solution (since if the admin layout is being called correctly by having layout "admin" in my admin controller it doesn't seem like I would have to do this), I am all ears!
BTW, I love you StackOverFlow. Thank you for all your patience and help.
my solution was to add
<% if logged_in %>
<body data-no-turbolink>
<% else %>
<body >
<% end %>
to both my admin and application layouts. This solves my problem, but if anyone has a more elegant solution (since if the admin layout is being called correctly by having layout "admin" in my admin controller it doesn't seem like I would have to do this), I am all ears!

Display current time globally with Ruby on Rails

I want to display the current time (of the server) with Time.now on all sites (different controllers).
Since the global displaying of headers/navigation bars and so on can be done within layout>application.html.erb I changed it to the following:
<!DOCTYPE html>
<html>
<head>
<title>Depot</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body class='<%= controller.controller_name %>'>
<nav>
<%= link_to 'Store', controller: 'store', action:'index' %>
<%= link_to 'Products', controller: 'products', action: 'index' %>
<span>Current time: <%= #time %></span>
<%= yield %>
</body>
</html>
Now I further hoped to possibly add the code to get the current time within the application_controller.rb.
Here's the code I have in there
class ApplicationController < ActionController::Base
# Prevent CSRF attacks by raising an exception.
# For APIs, you may want to use :null_session instead.
protect_from_forgery with: :exception
#time = Time.now
end
Unfortunately that's not working and I have to add the #time = Time.now - code within the controller (and method) I am using. This means I'd have to fill the code in several times and isn't that against the rails - idea?
I'd appreciate any help :)
In application controller
before_action :set_time
def set_time
#time = Time.now
end
Now you have #time available everywhere and always.

Rails render partial without entire html layout

Ok so I have a problem with rails and rendering partials. I have a layout called profile and inside of the profile layout I have all my js, stylesheets, etc included.
<html>
<head>
<title>Profile</title>
<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" %>
<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js" %>
<%= javascript_include_tag "application" %>
<%= stylesheet_link_tag "main" %>
<%= stylesheet_link_tag "reset" %>
<%= csrf_meta_tag %>
</head>
<body>
<%= yield %>
</body>
</html>
Inside of the yield tag(profile/index.html.erb) above is the following
<%= render :partial => 'pages/page', :layout => "layouts/default", :locals => {:page => #page } %>
Now in the pages/page view there are the same default tags such as css and js files. When i remove the css styles then I lose the styling for the pages/page view. Is there a way I can render a partial without recalling the same css and js files or what is a better way to go about doing something like so?
I always create the option to overwrite the stylesheets as follows:
<%= stylesheet_link_tag content_for?(:stylesheets) ? yield(:stylesheets) : "application", :debug => Rails.env.development? %>
Then inside a view
<% content_for :stylesheets %> some stuff or nothing in here <% end %>
That will let you specify in a view rendered in a layout you want no stylesheets and the same principle applies for javascripts.
That having been said if you are rendering a partial inside a layout that has an html tag and head etc. you should probably investigate if there is a better way to do what you are doing.
You need to pick one or the other: layout the original method call, or pass a layout to the partials. Doing both would be illogical.
There is a more thorough discussion here:
http://www.mikemayo.org/2012/rendering-a-collection-of-partials-with-content_for
I rarely see the usage of( or I am wondering if Rails support this usage... )
<!-- confirmed, this usage will cause error in Rails 3.2 -->
<%= render :partial => "some_partial", :layout => "some_layout" ... %>
I prefer to choose the specific layout in the controller:
def some_action
# some code
render :layout => "some_layout"
end
A partial is basically just a "slice of page" (like slice of cake... but in code form). It's designed to populate a small part of the page; typically one which will by dynamically updated depending on page variables.
Seems like you're confusing the purpose of layouts, views & partials in my opinion. If you want to dynamically load CSS / JS, put a "content_for" block in the profile views with a default layout, like this:
Layout
#layouts/default.rb
<html>
<head>
<title>Site Title</title>
<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" %>
<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js" %>
<%= javascript_include_tag "application" %>
<%= stylesheet_link_tag "main" %>
<%= stylesheet_link_tag "reset" %>
<%= yield :header_includes %>
<%= csrf_meta_tag %>
</head>
<body>
<%= yield %>
</body>
</html>
Views
#views/profiles/index.html.erb
<% content_for :header_includes do %>
<%= stylesheet "profile_custom_css" %>
<% end %>
Partial
Partials could be used to keep your code DRY & give the output of specific header files, like this:
Partial
#views/elements/_custom_header.rb
<% content_for :header_includes do %>
<% headers.each do |type, value| %>
<% if type == "java" %>
<%= javascript_include_tag value %>
<% else %>
<%= stylesheet_link_tag value %>
<% end %>
<% end %>
<% end %>
View
#views/profiles/index.html.erb
<%= render :partial => 'elements/custom_header', locals: { :headers => [["java", "profile_custom"], ["stylsheeet", "profile_custom"]] } %>
#Resume standard view code here
Layout
#layouts/default.rb
<html>
<head>
<title>Site Title</title>
<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" %>
<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js" %>
<%= javascript_include_tag "application" %>
<%= stylesheet_link_tag "main" %>
<%= stylesheet_link_tag "reset" %>
<%= yield :header_includes %>
<%= csrf_meta_tag %>
</head>
<body>
<%= yield %>
</body>
</html>
I've not tested passing the partial locals as a hash, so the syntax may be incorrect, but this is what we'd do to load up the required code. The added benefit is that content_for only yields content that has been defined (I.E you just have to include yield :custom_headers and it will only show if the content block is present)

Resources