I think there is a relative easy answer to this, but how can I make this link_to...:
<%= link_to(image_tag(p.thumbnail, class: "hoi"), "Something in here?") %>
...link to the same as this:
<a class="fg" href="#<%= p.id %>" data-toggle="modal">
?
(Just to be clear: When I click on the image in the link_to, I want to get linked to href="#<%= p.id %>" with the data-toggle="modal" option).
If you're trying to link an image to an anchor on the page, do this:
<%= link_to(image_tag(p.thumbnail, class: "hoi"), "##{p.id}") %>
You can do normal ruby string interpolation inside erb block (<%= %>)
Try something like this:
<%= link_to "##{p.id}", "Something in here?", :class => "fg", :data-toggle => "modal" %>
Related
I need to nest an 'a' element inside of another 'a' element like so:
<a href="www.example.com" class="so-and-so">
<span>something</span>
<i class="an-icon">
</a>
However I need to use the rails 'link_to' helpers instead of plain html. But when I try to nest the link_to helper like this:
<%= link_to "www.example.com", class: "so-and-so" do %>
<%= content_tag :span, "something" %>
<%= link_to "www.another.example.com", class: "another-link" do %>
<%= content_tag :i, class: "an-icon" %>
<% end %>
<% end %>
It outputs html more like this:
<a ...>
<span ...>
</a>
<a class="another-link" ...>...</a>
Any help would be greatly apreciated. Thank you!
EDIT
It turns out that rails was outputting the correct html after all, but the browser is not interpreting it correctly. It it possible to have a link inside of a link?
SOLVED (ISH)
It turns out that nesting <a> elements is not valid HTML, so the browser was just trying to "correct" my code. I ended up just placing the a element outside the other one and using CSS to make it look the same.
Since you need the inner link tag point at a destroy action on a controller. You can trigger the action by the click event of the first link.
$('#first_link').on('click', function() {
$.ajax({
type: "DELETE",
url: YOUR_SECOND_LINK ,
data: {id: YOUR_ID },
success: function(data, textStatus, jqXHR){...},
error: function(jqXHR, textStatus, errorThrown){...}
})
});
This can be achieved by using the <template> element which will prevent the browser from closing an anchor tag before another one is opened.
<%= link_to "www.example.com", class: "so-and-so" do %>
<%= content_tag :span, "something" %>
<template>
<%= link_to "www.another.example.com", class: "another-link" do %>
<%= content_tag :i, class: "an-icon" %>
<% end %>
</template>
<% end %>
I worked this out because I was refactoring Vue components that had nested anchor tags into html.erb files. It is a requirement of each of the individual Vue components that it is wrapped in a <template> tag so I copied it over and voila!
This is a simple question but I can't seem to find a solid answer. I simply want to know if this is valid? it's a basic form_for with in input at the bottom.
## Form
<%= form_for #snitch, html: { class: "form-actions", method: 'delete' } do |form| %>
<span class="button-text"><%= link_to 'NO WAY!', home_base_url_or_default(root_path), rel: "modal:close" %></span>
<button type="submit" class="button button--modal delete-snitch" data-snitch-id="<% #snitch.token %>" value="Yes, delete it.">
<% end %>
Is the third line valid? specifically where it says data-snitch-id="<% #snitch.token %>"? if it is not. can someone help me figure out how I can do something like that?
HTML data attributes are perfectly valid and widely supported. They're used to store custom data in an element. You can create elements with those attributes in rails helpers as well.
<%= button_tag "Yes, delete it.", type: :submit,
data: {"snitch-id" => #snitch.token},
class: 'button button--modal delete-snitch' %>
The only problem with your example is that you're not printing the value of #snitch.token. You should be using <%= #snitch.token %> instead of <% #snitch.token %>
Use #{ } expression instead.
data-snitch-id="#{#snitch.token}"
I am using a video slider in my website and the plugin requires the format to be the following:
<li class="slide" data-mightyslider="
cover:'path_to_cover',
title: 'title_name'">
</li>
I want to replace "path_to_cover" with <%= image_tag "image_name" %> but I cannot seem to get it to work with content_tag. How might I accomplish this?
The image_tag helper isn't what you want in this instance.
Try this:
<%= content_tag :li, class: "slide", data: { mightyslider: raw("cover: '#{image_path('something.jpg')}', title: 'title_name'") } do %>
list item content
<% end %>
I want to know that is there any rel attribute in <%= link_to_peramlink %> like tag in html has.
For example:
in html
my link
I have <%= link_to_permalink article,"con", nil, "my link", "5m" %> in rails. Is there any rel attribute in that?
link_to_permalink is not a standard Rails helper. A simple:
<%= link_to article.title, article %>
(you might have to adjust article.title) will get you a link to the article, assuming something like resources :articles is defined in routes.rb.
Setting a rel attribute is trivial:
<%= link_to article.title, article, :rel => 'nofollow' %>
or other attributes:
<%= link_to article.title, article, :rel => 'nofollow', :class => 'my-css-class' %>
Finally, I don't know what your link_to_permalink helper does, but you can use to_param to make seo-friendly permalinks: see here. (This is the "Rails Way," if you know what I mean.)
How can I apply the following to a div in rails so that when you click on the div it functions just like this link? Thanks
<%= link_to "#2", :class => "xtrig", :rel => "coda-slider-1" %>
I may be misunderstanding you but...
If you want the div to be a clickable link, the logical solution is to write something that generates
<a href="#2">
<div>
Some stuff
</div>
</a>
However, this is bad as putting block elements inside inline elements is wrong.
link_to can accept a block, so you could use spans:
<%= link_to('#2') do %>
<span>Some stuff</span>
<% end %>
Alternatively a Javascript handler on the div onclick event.
<%= link_to "link name", :anchor => "#2", :class => "xtrig", :rel => "coda-slider-1" %>
If you only want to have a block element in a separate line you do not need a <div> but you can make the <a> tag "behave like a div":
a.xtrig {
display: block;
}
Rails provide link_to block to wrap the html code inside it and make them clickable.
<%= link_to(your_path) do %>
Entire html code written inside will be clickable.
<% end %>