Writing HTML code with Rails - html

<% #ticket.conversations.each do |c| %>
<section class="messages">
<%="<li> #{c.the_message} </li>" %>
</section>
<%end%>
I am trying to have rails write the HTML code for me so the output would look something like this:
<li>MESSAGE1</li>
<li>MESSAGE2</li>
<li>Next message here...</li>
I am going to style every nth element to have a different style to show what speaker it belongs to. But currently is just outputs straight text and escapes the HTML. How do I stop this escape?

To output you need to use <%= as follows within your <section> block:
<%= "<li> #{c.the_message} </li>".html_safe %>
But currently is just outputs straight text and escapes the HTML
You can use the html_safe method. Please refer to the "Extensions to String" topic in this document: http://guides.rubyonrails.org/active_support_core_extensions.html
Another option you can use is the raw helper(as pointed out by Stefan) which calls the html_safe for you. e.g.
<%= raw "<li> #{c.the_message} </li>" %>

You can also style your list items this way:
<li><%= c.the_message %></li>
Just based upon preference.

Try it this way:
<% #ticket.conversations.each do |c| %>
<section class="messages">
<li><%= c.the_message %></li>
</section>
<% end %>
Or if you don't want to repeat <section> every time:
<section class="messages">
<% #ticket.conversations.each do |c| %>
<li><%= c.the_message %></li>
<% end %>
</section>

Related

Rails Assigning a class in html erb works in one place, doesn't work in another

I have a view where I make 2 loops to output the information. One as a menu and another as data:
<div class="base-form side-menu">
<ul class="food-groups">
<% #food_categories.each do |category| %>
<li class="<%= "#{Food::CATEGORIES[category]}"%>" data-content=".<%= "#{Food::CATEGORIES[category]}-content"%>"> <%="#{category}"%> </li>
<% end %>
</ul>
</div>
<div class="base-form main-form">
<% #food_categories.each do |cat| %>
<%= "#{Food::CATEGORIES[cat]}-content" %>
<div class="<%= "#{Food::CATEGORIES[cat]}-content"%>">
<% #foods.where(category: "#{Food::CATEGORIES[cat]}").find_each do |food| %>
<p>
<%= "Name: #{food.name}, portion: #{food.portion}, calories: #{food.calories}" %>
</p>
<% end %>
</div>
<% end %>
</div>
First loop works fine, each element gets its class correctly. Second loop(with |cat|) works, but the div's don't get any classes assigned. I even copied the class="<%=...%>" to the 't' from the first loop and it still doesn't work! Although just putting the string on the page that I'm also passing as a class works fine. I don't get it!

Remove unexpected content on a website

While following a tutorial on building a Ruby-on-Rails blogging website, I'm running into some unexpected results. The project so far is stored on https://github.com/khpeek/jumpstart-blogger.
The main page is an "Articles" page, which looks like this:
So far, so good (except for the somewhat curious position of the "Create a New Article" button, which used to be directly below the articles).
The appearance of "All Articles" is governed by app/views/articles/index.html.erb, which reads
<h1>All Articles</h1>
<ul id="articles">
<% #articles.each do |article| %>
<li>
<%= link_to article.title, article_path(article), class: 'article_title' %>
</li>
<% end %>
</ul>
<%= link_to "Create a New Article", new_article_path, class: "new_article" %>
The h1 heading is the first thing in the .html.erb file, and also the first thing that appears on the web page.
However, if I click on an article link, say "Article with Ruby Tag", I see the page below:
Besides the desired box with the article, tags, and comments, there are also two submit buttons and "<< Back to Articles List" buttons which are neither desired nor expected.
The appearance of this page is governed, as I understand it, by app/views/articles/show.html.erb, which reads
<h1><%= #article.title %></h1>
<p>
Tags:
<% #article.tags.each do |tag| %>
<%= link_to tag.name, tag_path(tag) %>
<% end %>
</p>
<% if #article.image.exists? %>
<p><%= image_tag #article.image.url %></p>
<% end %>
<p><%= #article.body %></p>
<h3>Comments (<%= #article.comments.size %>)</h3>
<%= render partial: 'articles/comment', collection: #article.comments %>
<%= render partial: 'comments/form' %>
<%= link_to "<< Back to Articles List", articles_path %>
<% if logged_in? %>
<%= link_to "delete", article_path(#article), method: :delete, data: {confirm: "Really delete the article?"} %>
<%= link_to "edit", edit_article_path(#article) %>
<% end %>
The first line in this file is the h1 header, but the 'unexpected' contents seems to come before that. So I'm having trouble seeing where to start to remove this content. Any pointers?
You're dealing with layout Rails' concept. Read this.
Anyway, you probably have a layout file in app/views/layouts.
check your application.html.erb in layouts folder.. it is rendering in header on some condition

eRB and multiple statements syntax?

I have the following in an html.erb file, using link_to to get a hyperlink and t() to internationalize my text. But it looks very clunky:
<p><%= t('session.new_user') %><%= link_to(t('session.signup_now'), signup_path) %></p>
Splitting onto multiple lines seems wrong since the text will all appear on the same line on screen but is there a better syntax to avoid the two consecutive <%= %> blocks?
I would probably go for line breaks:
<p>
<%= t('session.new_user') %>
<%= link_to t('session.signup_now'), signup_path %>
</p>
or you could set variables before the actual code
<% new_user_text = t('session.new_user') %>
<% link = link_to t('session.signup_now'), signup_path %>
<p><%= new_user_text %><%= link %></p>
or you could set instance variables in the controller. I wouldn't like that for view stuff like this.
Extra: if you like tidy code you may like haml
%p
= t('session.new_user')
= link_to t('session.signup_now'), signup_path
now it is actualle readable!
You can add a hyphen before the closing tag to prevent a newline being appended to the output.
<% ... -%>
Please note that this feature is Rails specific.

How to link_to an html anchor tag

I have been trying to make a number of lists where after clicking each list its content gets edited. I'am using twitter bootstrap, embedded HTML in this Ruby on Rails app.
<div class="list-group">
<% #statuses.each do |status| %>
<%= status.content %>
<% end %>
</div>
Here i did not get how to get these <%= link_to to get connected with each <a href="" URL's of the status.
<%= link_to 'Edit', edit_status_path(status) %>
Please help i m totally confused.
Thanks in advance.
If you want the entire status to actually be a link, like you did with a manual anchor tag in your example, then try:
<div class="list-group">
<% #statuses.each do |status| %>
<%= link_to status.content, edit_status_path(status), class: "list-group-item" %>
<% end %>
</div>
Also see http://api.rubyonrails.org/classes/ActionView/Helpers/UrlHelper.html#method-i-link_to.

Link_to in rails and dynamic names from modal#show

I have a loop that creates a list of works from the modal work
//does work but want test to be <%= work. name %>
<ol class="meny-control mobile">
<% #works.each do |work| %>
<li class="" data-id="<%= work.id %>"><%= link_to 'test', work %></li>
<% end %>
</ol>
//doesnt work but want it to
<ol class="meny-control mobile">
<% #works.each do |work| %>
<li class="" data-id="<%= work.id %>"><%= link_to '<%= work.name %>', work %></li>
<% end %>
</ol>
As you would guess the <%= work.name %> throws a syntax error. How do I correctly format the link_to to display each work.name as the 'path' && the anchor's inner html as work.name.
Being new to rails, I'm still really iffy on understanding documentation properly. Could you please reference from link_to() (if even there) where this format is explained so I use this for future referencing & understanding --also how to properly edit the stack question title for future similar question.
The error is because of the nesting of <% tags and I suppose you already are aware of that. To solve your problem use the following:
<%= link_to "#{work.name}", work %>
The #{} is used to interpolate variables, i.e. replacing variables with their values within the string literals as in link_to "#{work.name}" above where work.name will be replaced by the value work.name holds.
you don't need "#{}".
you can write this:<%= link_to work.name, work %>