I am failing to render my application.html.erb template i am getting the following error
ActionView::SyntaxErrorInTemplate in ApplicationController#home
app/views/layouts/application.HTML.erb:10: syntax error, unexpected ':', expecting ')'
app/views/layouts/application.HTML.erb:11: syntax error, unexpected ':', expecting ')'
This is what the code looks like this application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Appz</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag "application" , "data-turbo-track" : "reload" %>
<%= javascript_include_tag "application" , "data-turbo-track" : "reload" , defer: true %>
</head>
<body>
<div class="container">
<div class="row">
<div class="col">
</div>
</div>
</div>
<%= yield %>
</body>
</html>
my code looks ok I have tried everything what could be the problem
You need to remove white space before :. Change the line and below line like this:
<%= stylesheet_link_tag "application" , "data-turbo-track": "reload" %>
Yes removing the white space works apparently I had a formatting extension enabled in vs code and it was messing up my code it was auto indenting unnecessarily and messing up the code I only became aware when I tried to correct the code by removing the white space and each time I saved it auto indented until I disabled the extension and it stopped I have since uninstalled the extension.
So be careful what kind of extensions you install in your code editor you will get new and unfounded errors no one has seen before.
Related
currently, I try to understand and learn Rails. The problem I face right now is that I have set up toastr via the importmap feature of Rails 7. Everything works fine when I use the console of the browser like toastr.success("Hello World!") shows a green toast on the top right corner of the screen. When I do the same thing in a script tag in an .hmtl.erb file I get Uncaught TypeError: toastr is undefined. I also tried assigning the toastr object to window and globalThis in the application.js file, but this wont work either, with the same error message.
I guess there is a sequencing issue because the erb files are created server side and the javascript is done client side, but I don't know how to fix this.
Important files:
// /app/javascript/application.js
import "jquery";
import "toastr";
// /app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
<%= javascript_importmap_tags %>
<script>
globalThis.toastr.success("Hello World!")
</script>
</head>
<body>
<h1>Hi!</h1>
</body>
</html>
# Pin npm packages by running ./bin/importmap
pin 'application', preload: true
pin 'toastr'
pin 'jquery'
If there is more you need, just let me know.
Thanks in advance!
I created a model called Post for my rails projects
the problem is i keep on getting this error:
Errno::ENOENT in Posts#index
Showing C:/Users/Sam's/Desktop/Websites/projects/christina/cp-blog/app/views/layouts/application.html.erb where line #5 raised:
My application.html.erb file looks like this
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<%= yield %>
</body>
</html>
Is there any way to fix this (I already install nodejs and restarted windows)
First, stylesheet_link_tag, returns a stylesheet link tag for the sources specified as arguments. It will check application.scss or application.css in your app/assets/stylsheets. Make sure application.css or application.scss exist in that specified path.
Second, if file exist, then reinstall gem using,
bundle install -f
answer
The way I fixed this was by getting rid of the require.tree in application.css and application.js
I have following html page home.html.erb:
<% provide(:title, 'Home') %>
<h1>Sample App</h1>
<p>
This is the home page for the
Ruby on Rails Tutorial
sample application.
</p>
And I have the following layout application.html.erb
<!DOCTYPE html>
<html>
<head>
<title><%= full_title(yield(:title)) %></title>
...
</head>
<body>
<%= yield %>
</body>
</html>
full_title() is a function that checks if there was a title passed as a parameter. If there was, it will place it into the HTML. If no parameter is given, it will place a base title into the HTML.
I'm assuming rails begins by going through the application.html.erb and then upon reaching <%= yield %>, it will embed the contents of home.html.erb into application.html.erb at that location, resulting in the following document:
<!DOCTYPE html>
<html>
<head>
<title><%= full_title(yield(:title)) %></title>
...
</head>
<body>
<% provide(:title, 'Home') %>
<h1>Sample App</h1>
<p>
This is the home page for the
Ruby on Rails Tutorial
sample application.
</p>
</body>
</html>
In the 4th line <%= full_title(yield(:title)) %>, the value "Home" is definitely being passed for :title, but the code <% provide(:title, 'Home') %> doesn't come until several lines later. Is Rails going backwards to accomplish this? How is this happening?
No it's don't. This is kind of string interpolation, this value will be replaced after every call of provide(:title, ...)
My understanding is that the home.html.erb is processed before the application layout. In other words, the view and helper are prepared and 'plugged-in' to the application layout before the whole thing is complete. I guess "going backwards" depends on which way you look at it / how it actually works. I'm still learning too, but it's not necessarily a 'top to bottom' sequence in terms of how the code is layed out on the page.
I'm new to rails. I currently have 3 pages in my web app. I am wondering what is the "cool rails way" where I can easily implement the same banner (pic/website logo/text) and horizontal navigation menu on each page with out having to copy and paste the code or create separate CSS files for each page. Is this possible? Would like to stick with Ruby/Rails/CSS/HTML.
Also, It seems that if I create a css element titled banner for one view of one controller another view of a different controller has the same styling. Is there something going on behind the scenes here?
Thanks.
This is usually accomplished through application.html.erb. You put the header of your web site in that page followed by a <%= yield %> statement and then the footer. The yield statement inserts the content from whatever action is being processed.
For example:
application.html.erb
<html>
<head>
</head>
<body>
<h1>My cool web site header and menu!</h1>
<%=yield %>
<p>Web site footer</p>
index.html.erb
<h2>Index</h2>
<ul>
<% #stuff.each do |thing| %>
<li><%=thing.name%></li>
<% end %>
</ul>
The contents of index.html.erb will be inserted into the application.html.erb at the spot where <%=yield %> appears.
Following this tutorial: http://ruby.railstutorial.org/ruby-on-rails-tutorial-book ,
the way to do it is to use rendermethod.
example code from the tutorial:
app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
<head>
<title><%= full_title(yield(:title)) %></title>
<%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" =>
true %>
<%= javascript_include_tag "application", "data-turbolinks-track" =>
true %>
<%= csrf_meta_tags %>
<%= render 'layouts/shim' %>
</head>
<body>
<%= render 'layouts/header' %>
<div class="container">
<%= render 'layouts/flash' %>
<%= yield %>
<%= render 'layouts/footer' %>
</div>
</body>
</html>
According to the tutorial, the way in rails to pack up a logical unit in one place is to use a facility called partials.
For example, you can pack up your navigation bar in app/views/layouts/_navbar.html.erb
then it can be rendered in the layout with <%= render 'layouts/navbar' %>
More about the parials: http://ruby.railstutorial.org/chapters/filling-in-the-layout#sec-partials
Rails defaults to concatenating all CSS files into one master. http://guides.rubyonrails.org/asset_pipeline.html
I'm writing code for a Rails view in TextMate (using the 2-space indentation standard). Whenever I view the output of my webpages (View Source), the HTML brackets always seem weirdly indented. For example, my application.html.erb looks like this:
<!DOCTYPE html>
<html>
<head>
<title>Rainleader</title>
<%= stylesheet_link_tag :all %>
<%= javascript_include_tag :all %>
<%= csrf_meta_tag %>
</head>
<body>
<div id="outer">
<div class="contentwidth main">
<%= render 'layouts/header' %>
</div>
<%= yield %>
</body>
</html>
And the partial it's rendering (_header.html.erb) looks like this:
<div class="logo">
<h1>minimal.</h1>
</div><!-- end logo -->
But, an excerpt of the outputted HTML has misplaced (mis-indented) brackets (see my notes in the code below):
<body>
<div id="outer">
<div class="contentwidth main">
<div class="logo"> <<<Why is this so far to the right?
<h1>minimal.</h1> <<<Why is this so far to the left?
</div><!-- end logo -->
What's going on here? If my call to the _header.html.erb partial in application.html.erb is indented four spaces, do I need to indent the code in the partial by at least that same amount to have it nest properly?
The first line of the partial that is rendered is indented as <%= render 'layouts/header' %> in application.html.erb. But all other lines of code are not indented further, just left-aligned as they are in your partial. It bugged me too, which is part of why I started using haml.