Link_to using on div instead of text - html

Can I use the link_to clickable for the whole div instead of only clicking on ¨Boeken naar afas¨?
Like at this moment if you click on ¨boeken naar afas¨ then the link_to does something.
I want to have it on the div instead of the text. So when you click on the div then it will be triggerd the ¨update_bookkeeping_claims_claim_manager_path(#claim_manager), method: 'post'¨
.col-sm-6.col-md-5.col-lg-3.item.ibox-title.import{:onclick => "move()"}
.box.boxBatenmanager
.boxInsite.boxTop
%i.fa.fa-exchange.icon.iconApps
%h3.name
Baten boeken naar #{#claim_manager.bookkeeping_name || 'AFAS'} do
%br/
%h4.description
Uw heeft #{#claim_manager.claims.scheduled_to_update_bookkeeping.count} baten
(#{#claim_manager.institution_claim_mutations.scheduled_to_update_bookkeeping.count} mutaties) aangemerkt om te boeken.
= link_to "Boeken naar AFAS", update_bookkeeping_claims_claim_manager_path(#claim_manager), method: 'post'
%br/

You can pass a block instead of a text label to the link_to helper, which allows you to nest your whole markup in the link:
= link_to update_bookkeeping_claims_claim_manager_path(#claim_manager), method: 'post' do
.col-sm-6.col-md-5.col-lg-3.item.ibox-title.import{:onclick => "move()"}
[...]

Related

How to set dynamic background image of a div ONLY if an image is present in the database

I am attempting to have dynamic background images for multiple divs through index.html.erb, and have accomplished this through inline styling with the background URL being pulled from my database (using carrierwave). It looks something like this right now:
<div class="style-box col-8 ml-auto mr-auto" style="background: url(<%= place.photos.first.picture.url %>)">
<h1><%= link_to place.name, place_path(place) %></h1>
<i><%= place.address %></i>
<br /><br />
<p><%= place.description %></p>
The issue I'm running into is that, when a new place is created, if an image for the new place isn't present (which it wont be immediately upon creation), the view can't create the full html page with incomplete data (ie. place.photos is nil). Is there a way, using this method or something similar, to make the background image overide the default style-box background ONLY if an image for a new place is present? Typically I'd use an if statement, but can't think of a way to make an if statement update CSS with rails.
If you want to keep everything inline you can do:
<div class="style-box col-8 ml-auto mr-auto"
style="background: url(<%= place.photos.first&.picture.url || "/images/default.jpg" %>)">
<h1><%= link_to place.name, place_path(place) %></h1>
<i><%= place.address %></i>
<br /><br />
<p><%= place.description %></p>
</div>
This is using the or operator (||) which lets the first value through if present, or the second as a default. Also, the & will keep the page from having errors if there are no photos. This is essentially the same as writing:
style="background: url(
<% if place.photos.first&.picture&.url %>
<%= place.photos.first&.picture&.url %>
<% else %>
/images/default.jpg
<% end %>
)">
You could also move this into a helper method to let you clean things up, something like:
# in one of the app/helpers modules
def picture_url_or_default(place, default_url = '/images/default.jpg')
return default_url if place.photos.empty
return default_url if place.photos.first.picture.nil?
return default_url if place.photos.first.picture.url.nil?
place.photos.first.picture.url
end
# in the view
<div class="style-box col-8 ml-auto mr-auto"
style="background: url(<%= picture_url_or_default(place))">
...

Disable a link when already on the page

I have a list(ul) which when click you will be redirected to another page, what I want to do is disable the clickable link when you are already on that page and also, have it highlighted.
<div class="selection">
<ul>
<li>Name</li>
<li>Comments</li>
</ul>
TYIA!
You can try with a helper so you can use this on other parts, because you will need to.
def active_link(text, path)
class_name = current_page?(path) ? 'active' : nil
link_to text, path, :class => class_name
end
this will print a link with the class active if the link it's the same as the current page
active_link 'home', root_path
Now you can combine this with css so you can disable the click on the link when this have the active class
a.active {
pointer-events: none;
cursor: default;
}
then with this all the links that you print with the helper will have the active class and with the css, this wouldn't have events on the click.
You can make use of current_page?
<ul>
<% if current_page?('/name') %>
<li><strong>Name</strong></li>
<% else %>
<li>Name</li>
<% end %>
<% if current_page?('/comments') %>
<li><strong>Comments</strong></li>
<% else %>
<li>Comments</li>
<% end %>
</ul>
Use jQuery
HTML part
<div class="selection">
<ul id="menu">
<li>Name</li>
<li>Comments</li>
</ul>
jQuery
$(document).ready(function () {
$("#menu a").each(function(){
//set all menu items to 'black
$(this).css("color","black");
var linkPath=$(this).attr("href");
var relativePath=window.location.pathname.replace('http://'+window.location.hostname,'');
//set the <a> with the same path as the current address to blue
if(linkPath==relativePath)
$(this).css("color","blue");
});
});
enter link description here
after looking at your question, I think that the simplest answer to your solution while only utilizing html may be to get rid of the <a>...</a> tag on the source page so that when you're there, the text will show but is not linkable. As for having your text highlighted while on that page, use <mark>...</mark> as a child element of <li>...</li>.
An example, assuming that "name" is the active page:
<div class="selection">
<ul>
<li><mark>Name</mark></li>
<li>Comments</li>
</ul>
</div>
Hope this helps a bit.

Razor's engine does not automatically encode HTML tags

To be honest, this is my first time using asp.net web api and Razor.
I received an asp.net web api solution which uses itextSharp to generate a pdf.
The pdf is generated, but it is showing html tags that were sent with the content via jquery and JSON.
This is how it looks in PDF:
<div class="nf-filler-control-border"><div class="nf-filler-control-inner"><div class="ms-r
testate-field"><div
class="ExternalClassD88FE0C0B2A64B1797917A506C26ACA2"><div
class="ExternalClassAD6BB90065794E90B1097577B8697812">Aantal genodigden: 19</div><div
class="ExternalClassAD6BB90065794E90B1097577B8697812">Aantal aanwezig: 15</div><p
class="ExternalClassAD6BB90065794E90B1097577B8697812">Aantal ziek/verlof: 3</p><div
class="ExternalClassAD6BB90065794E90B1097577B8697812"><ol><li>Bij veiligheidsrondgang uitgevoerd op 02/04/13. Veel
gereedschap ligt niet op hun plaats, is onbeheerd achtergelaten, ligt in fietskarren, en zijn bovendien niet ingeschreven in
het register; kasten staan open, ladders niet afgesloten.</li><li>Persoonlijk werkgereedschap blijft gewoon liggen zelf
heeft men de dag erna verlof. = rommel.</li><li>Bij controle stekkers verleng kabels zien we dat de trekontlasting niet
correct gebruikt wordt en dat de insnijdingen te groot zijn. Zie foto's.</li>
<li>Alle communicatie (ziektebriefjes, KV,.....)met HR is nu naar Interleuvenlaan 27A - 3001 Herverlee
(achterzijde personeelsbadge)</li></ol></div></div></div></div></div>
this is the piece of code that displays data which is sent via jquery's ajax function: #Model.Description
And this is where the Razor engine parses the html template: return Razor.Parse(template, model);
Anyone has got any idea how to show the content properly inside the pdf without showing up the html tags on the document?
the html table shows fine, only the data displayed by #Model.Description does not show correctly.
this is the code:
private static string GetReport(ToolBoxMeeting tm)
{
var config = new TemplateServiceConfiguration
{
BaseTemplateType = typeof (HtmlTemplateBase<>)
};
using (new TemplateService(config))
{
string template = #"<html>
<body >
<table >
<tr>
<td'>Description</td>
<td>
#Model.Description
</td>
</tr>
</table>
</body>
</html>";
var model = tm;
return Razor.Parse(template, model);
}
}

Rails Internationalization, html tag

I'm having some problems having html tags correctly loaded in my Rails 3.2 app, and have no clue why. I managed to get it working for one flash message, but I am not managing to do it with a confirmation message.
Any ideas ?
My pt.yml file extract :
buttons:
accept_terms: "Aceito os termos e condições"
save: "Gravar"
delete: "Apagar"
add_new_receipt: "+"
add_receipt_label: "Clique para adicionar novo recibo"
download_all_html: "Tem a certeza que deseja descarregar todos os ficheiros correspondentes à pesquisa? <br />
Esta operação pode demorar algum tempo, dependendo do número de ficheiros e da sua ligação à Internet "
my view code:
<%= link_to (t :download_all, scope: "pages.home.customers"), user_download_all_path(user_id:current_user.id, is_retailer: params[:controller]=='suppliers' ? true : false), method: :post, class: "btn btn-primary", confirm: t(:download_all_html, scope: "buttons") %>
In the end, My confirmation message shows the <br /> as is....
I believe I am following rails guidelines here, so any help would be appreciated to figure this one out.
Edit
I had already tried html_safe.
I have one other example that is working :
tags:
error_message_html: "O número %{message} ou não existe ou já foi mapeado.<br />
Por favor verifique que o número corresponde à empresa seleccionada "
and I invoke it inside a controller :
flash[:error] = t :error_message_html, scope: "forms.tags", message: params[:tag][:number]
Rails will escape the html contained in the translation
You can allow the html to be used with html_safe
<%= link_to (t :download_all, scope: "pages.home.customers").html_safe, user_download_all_path(user_id:current_user.id, is_retailer: params[:controller]=='suppliers' ? true : false), method: :post, class: "btn btn-primary", confirm: t(:download_all_html, scope: "buttons") %>

Rails: Adding an empty tag plus content to link_to

I'm trying to generate a link using the link_to helper that will output the following HTML:
<i class="some_class"></i>Link Name
However the code I'm using to try to accomplish this:
link_to(tag("i", class: options[:icon]) + title, url)
...is outputting:
<i class="some_class">Link Name</i>
Why is it doing this, and how can I fix it? Thanks.
EDIT:
I believe I found the issue.
<i> tags are not self-closable tags in HTML5. Therefore the text after the i is treated as that element's content.
Have you tried using the block format of link_to?
<%= link_to url do %>
<%= tag("i", class: options[:icon]) %>
Link Name
<% end %>
Tweak that to your needs and maybe you'll get what you're looking for.
This is the icon tag helper I use in my applications which I frequently pass as the first argument to link_to, which can either be used to create a icon tag alone, or an icon tag followed by text.
def icon_tag(icon, *args)
options = args.extract_options!
text = args.first || options.delete(:text)
if text.nil?
content_tag :i, "", class: ["icon", "icon-#{icon}"] + options[:class].to_a
else
"#{icon_tag icon} #{text}".html_safe
end
end