A link inside a link? - html

I am making a rails app, and I have a class that is a link (its inside a tag). I want <%= User.find_by_id(p.user_id).username %> to be a link to the user, so my questions are:
1) How do I make it a link to the user?
2) When I click on a link that I make, that is inside another link, it activates the outer link. How can I make the click respond the the inner link instead? (in the code under).
<div class="row">
<a class="fg" href="#<%= p.id %>" data-toggle="modal">
<div class="span6 offset3">
<div class="thumbnail">
<table border="0" width="100%" cellpadding="5px">
<tr>
<td>
<%= image_tag(p.thumbnail, class: "hoi") %>
</td>
<td id="tzt2" width="60%">
<div id="withJosefin">
<%= p.title %>
</div>
<div id="withLibre">
by <%= User.find_by_id(p.user_id).username %> <%= time_ago_in_words(p.created_at) %> ago
</div>
</td>
</tr>
</table>
</div>
</div>
</a>
</div>

You can create a link using this syntax:
<% user = User.find_by_id(p.user_id) %>
<%= link_to user.username, user %>
Which is equivalent to:
<%= link_to p.user.username, user_path(p.user) %>
By the way, why do you load the user manually? If your associations are set up correctly, you can just write:
<%= link_to p.user.username, p.user %>
I'm not sure I understood your second question. If you can explain it a bit more clearly I'll edit my answer.

You cant nest hyperlinks.
You could either use some JavaScript to simulate the effect of nested hyper links, or a better solution is to reorganize your markup so that it is valid markup. i.e. your first tag shouldnt contain divs etc.

Related

Cannot make clickable elements, RoR

I have root page with some pics and text, so that visitors could click either on pics or text and be forwarded to desired part of my app.
My basic html code
<div class="tprod">
<div class="titimg"><%= image_tag('atkr_1.jpg') %></div>
<div class="text">
<div class="antr">
<h2><%= I18n.t 'Waste_recycling_equipment'%></h2>
</div>
<%= I18n.t 'waste_intro_start' %>
</div>
<%= link_to (I18n.t 'read_more'),products_path(:category => #waste_root.name) %>
</div>
When I try to add link_to for image_tag, suddenly image changes position.
<div class="tprod">
<div class="titimg"> <%= link_to image_tag('energ_1.jpg') %> </div>
<div class="text">
<div class="antr">
<h2><%= I18n.t 'Energy_wood_machinery'%></h2>
</div>
<%= I18n.t 'energo_intro_start' %>
</div>
<%= link_to (I18n.t 'read_more'),products_path(:category => #energy_root.name) %>
</div>
Looks like this
I was wondering it is because now it is link element combined with image_tag so It has different CSS formatting?
Application is available here
It's working for me on Chrome:
Formatting
The likely issue you have is with your CSS, not Rails
After looking at your picture, I would say the issue is likely to be with your use of float: left;
float basically treats the element as an inline item, meaning if its width / structure is not consistent in even the smallest degree, it can cause issues like you're seeing.
To fix this, I would strongly recommend using the good old <table> tag. It might seem old skool, but it's certainly what you've got here:
<table class="items">
<tr>
<% #items.each do |item| %>
<td><%= image_tag item.image.url %></td>
<% end %>
</tr>
<tr>
<% #items.each do |item| %>
<td><%= item.description %></td>
<% end %>
</tr>
</table>
This might get frowned upon for the use of <table>, but I believe it will work for what you've got here.
It's because of your #content .mainprods .tprod a css affecting the anchor tag you're creating around the image.
You need to make the css more specific in order to only specify the anchor at the bottom. For example, if you added :class => "read-more" to the bottom link_to, then you could change the css selector to #content .mainprods .tprod a.read-more and only style the bottom link. There's a number of different approaches for that.
Also, as an aside, (I18n.t 'read_more') is bad practice.. It should be I18n.t('read_more') ;)

link_to does not render dynamic data

My main page content is generated with this code:
<% #post.each do |post| %>
<div class="post" style="background:url(<%= post.postimg.url.to_s%>)center center">
<div class="overlay">
<p class="post_title"><%= post.titre %></p>
<p class="post_pseudo"><%= link_to Utilisateur.find(post.utilisateur_id).pseudo ,Utilisateur.find(post.utilisateur_id).pseudo %></p>
</div>
</div>
<% end %>
This snippet is inn _postgeneration.html.erb. The main page (index.html.erb ) look like this :
<%= render "headerhome"%>
<%= render "postgeneration"%>
When the user is redirected from a controller with redirect_to , everything works as expected, my posts are displayed. But when my page is generated from a link_to, only my HTML is displayed correctly. Here's my syntax for link_to
<%= link_to "homepage", '/home'%>
It looks like link_to refuse to render html elements dynamically generated.
The #post.each do wasn't ignored. The post were generated, but without visual, because the visual was set in inline css. The solution was to delete the inline css and put a image_tag. Now everything is working as expected. I didn't know Rails could ignore inline css. Thanks everyone !

How to hide an entire DIV in a rails project if no data is being passed to it from the CMS?

Using Refinery CMS to create product pages in our prototype. An admin can add a link to the main product page, and it will display similar to
Product Links
www.example.com/product/1
www.example.com/product/2
here is a screenshot of how it currently is being displayed
However, there will not always be a case when the ink is added. And this looks weird to have that field but no links in there because every element has margin-bottom:30px;
So my question is how do I make the element not show up at all if nothing is passed to it. Here is the code for the element:
HTML
<div class="contentPageElement">
<h3>Product Links</h3>
<%= link_to #discussion.link.to_s, #discussion.link %>
</div>
you can either put it in helper,or do something like this.
<% unless #discussion.link.empty? %>
<div class="contentPageElement">
<h3>Product Links</h3>
<%= link_to #discussion.link.to_s, #discussion.link %>
</div>
<% end %>
I think this is what you're looking for: http://apidock.com/rails/ActionView/Helpers/UrlHelper/link_to_unless

Rails is adding a </form> tag in a spot that is not where I closed the do block, it is breaking my form

I'm having one heck of an issue working out how to do this. I have 2 forms that need to be displayed next to each other but you can't embed forms, I got around this by just putting the 2nd form after the first one.
However, rails is ignoring my <% end %> tag for the 2nd form and it is auto-closing the 2nd form before it needs to be closed. This is making my form not work.
Here's the view with some bits omitted for brevity.
<div class="row">
<div class="col-md-3">
<div class="well">
<%= render "shared/some_form", url_path: foo_path %>
<%= form_tag some_other_path, method: :delete, id: "form_bulk_action", role: "form" do %>
<div id="bulk_action_group">
<div class="form-group">
<%= label_tag "perform_bulk_action", "For each checked item" %>
<%= select_tag "perform_bulk_action", options_for_select([ ["Delete", "destroy"] ]), class: "form-control" %>
</div>
<%= button_tag id: "foo" %>
</div>
</div>
</div>
<div class="col-md-9">
<table class="table table-condensed table-hover">
<thead>
<tr>
<th><%= check_box_tag :check_all_data_rows, "", false %></th>
</tr>
</thead>
<tbody>
<% #foo.each do |foo| %>
<tr>
<td><%= check_box_tag "bulk_ids[]", foo.id, false, %></td>
</tr>
<% end %>
</tbody>
</table>
</div>
</div>
<% end %>
The partial that is loading some_form is the first form. The beginning and end of that form happens inside of the partial.
The second form is the form_tag. As you can see from the html markup we have a sidebar on the left and the main contents on the right being loaded in a table.
The idea of the 2nd form is it allows you to check off rows and then perform a bulk action on the checked off items. Similar to how you might mark 15 e-mails in gmail and then delete them.
The problem is rails is ignoring the <% end %> at the bottom of that code snippet and instead it's injecting a </form> right after the button with an id: foo.
This is causing the bulk_ids value to always be nil because at that point the form is already closed and they are not part of the form. The crazy thing is it only fails when you goto the page from another page (ie. turbolinks). It works when you do a full load of the page, however I think the main issue is the premature closing of the </form> tag.
How can I set this all up so the forms are not embedded and the 2nd form closes all the way at the bottom of the table while still using the form helpers?
Your root problem appears to be forms are both actions and rectangles. So you need a little rectangle inside a bigger one, each with its own, different action. A CSS expert might know how to write a <form style="display:inline" ...> such that one form can flow around another, without enforcing a rectangular shape.
I believe the problem is that the form originates with the render shared/some_form call that is inside the , but the code to close the form is outside that div and after a table. If you move the start of the form to above all the divs shown here and have all the divs and tables reside inside the form, then it should work.
My understanding is that a form is not meant to operate correctly half inside another element and thus a form should either be within or outside other elements, not partially.
Here is a little more information about forms and tables (and divs): Form inside a table

Im trying to put a thumbnail in my ruby on rails project, How would I save the image in mysql?

This is my code below in the ruby on rails project. As for mysql, How would I save an image in the database so when the application calls "user.image" it knows what to call? is it just a link to the image that goes in the "image" column? is it url? and must the picture be saved anywhere else for it to display properly?
<div class="page-header">
<h2>Users</h2>
</div>
<% #users.each do |user| %>
<div class="user">
<ul class="thumbnails">
<li class="span2">
<a href="#" class="thumbnail">
<img src="<%= user.image %>" alt="<%= user.nickname %>">
</a>
</li>
<strong><%= user.nickname%></strong>
<p><%= user.first_name%> <%= user.last_name%></p>
<div class="meta">
<%= link_to 'Show', user %>
</div>
</div>
</ul>
<% end %>
Have you tried looking at Carrierwave Gem?
Here is the rails cast.
http://railscasts.com/episodes/253-carrierwave-file-uploads
I am new to rails as well and found this a great way to upload images for just what you are trying to do.
Here is the github page
https://github.com/carrierwaveuploader/carrierwave