I want to add a forward slash to one of my db seeds. Here is how I'm trying it:
Template.create! code: '<div style="background-image: url("/assets/forest-trees-hiker-hiking.jpg");></div>'
This results in spaces instead of slashes though...
style="background-image: url(" assets forest-trees-hiker-hiking.jpg");
It looks like you're very close with the suggestions noted in the comments, but you're missing one closing quotation mark after the semicolon:
"<div style='background-image: url(\"/assets/forest-trees-hiker-hiking.jpg\");'></div>"
Note that the entire div is wrapped in double quotes, and the style is wrapped in single quotes, which can be nested without confusion. But since you need to nest another string within those strings, you must escape the quotes around the url, in order to tell the program that you are not closing one of your existing quotation marks.
As #usmanali wrote, you have to use backslash escape sign \
This should works for you: Template.create! code: '<div style="background-image: url("\/assets\/forest-trees-hiker-hiking.jpg");></div>'
More reading: http://en.wikibooks.org/wiki/Ruby_Programming/Strings#Single_quotes
Related
I need an image loaded onto a html img tag using thymeleaf. The problem is, the image itself is obtained from a url which takes in two parameters.
Sample:
<img src="/products/images?categoryId=1&image=1" />
The trouble is, the image parameter is generated dynamically and hence I need to use a thymeleaf expression there. Therefore I tried something like this:
<img th:src="#{'/products/images?categoryId=1&image=' + ${product.id}}" />
But when I run this, I get the following message:
Exception parsing document: template="product-list", line 104 - column 59
Which points to the location where the '&' symbol occurs. Now, I have tried using '& amp;' but then, the url becomes something like
/products/images?categoryId=1&image=1
Obviously, this is not going to work.
So how else do I make a valid link with two parameters using thymeleaf then?
This can easily done by Thymeleaf. Don't concatenate strings and
simply use #{'/products/images'(categoryId=1, image= ${product.id})}
See the documentation.
The way that you escape an ampersand & in any html attribute is &. Actually you should always escape ampersands in all html attributes whether you are using Thymeleaf or not.
See this question for more details and references:
Do I encode ampersands in <a href...>?
I'm trying to bind a data attribute as follows:
#Html.Label("test", new { data_test = "{{vm.test}}" })
When rendered, what I see is:
<label data-test for="test">test</label>
How do I escape the curly braces so that they're rendered on the page? Some things a I've tried are:
{{{{vm.test}}}}
\\{\\{vm.test\\}\\}
If you need to display the curly braces, as when you're explaining handlebar logic and you don't need any other constructs:
Code:
<note>Example: #("{{object.exampleField}}")</note>
Displayed:
Example: {{object.exampleField}}
Inside a code block, you cannot use # characters to create more code blocks.
something like:
#Html.Label("test", new { data_test = "{{#vm.test}}" })
To write curly braces "{}" in razor use the combination of "at" and "colon".
Example: #:{
I had just figured it out while using handle bars.
And to write "#" use one more "at" sign.
Example: ##
I hope it helps the new ones who are looking for it!
I'm learning RAZOR.
I need to make an href tag unique, by adding a letter to the start of the #ref:
eg.
<a href="#p23">
In Razor, to populate the href tag from my model, I have:
<a href="#p#item.ID">
However, Razor doesn't recognise #item.ID, unless it has no characters in front of it.
<a href="#p #item.ID">
But that then invalidates the href.
Is there a way for me to add the letter 'p' to this, and still allow RAZOR to add the ID of the item?
Thank you,
Mark
Just wrap it in parenthesis to aid the parser:
<a href="#p#(item.ID)">
In VB enclose the variable with brackets: "#p#(item.ID)"
in c# it's either the same or use curly brackets.
fixit
just put brackets around the item, i.e.
<a href="#p#(item.ID)">
you can do this across all of the razor syntax where required to mix/match
I want to add a link to each element of an array, then join the resulting array. I tried:
myarray.collect{|u| link_to u[:first_name], username_path(u[:username])}.join(', ')
This does everything correctly, except it returns:
<a href="/niels">Niels Bohr</a>, <a href="/richard">Richard Feynman</a>
Instead of
Niels Bohr, Richard Feynman
How do I fix this? Or is there a simpler way of proceeding?
Thanks.
Use html_safe
myarray.collect{|u| link_to u[:first_name], username_path(u[:username])}.join(', ').html_safe
There is nothing wrong with adding the links or joining the elements of the list. That all works fine. What is wrong is that your string is considered unsafe and some of the characters used to construct valid HTML (and more importantly, javascript) are being escaped.
As fl00r says, you should add
.html_safe after the string, to tell the rendering function that any HTML in the function can be safely sent to the browser as-is.
I developing a blog and some really annoying stuff is happening with newline characters (\n). Everything works fine except if I make a post that contains pre tags my newline characters screw up the indentation.
So if I have code that looks like this
<pre>
<code>
some code some code
more code more code
</code>
</pre>
For some reason the newline characters that are saved in the db field with the post are causing whatever is inside the pre tag to be indented by a tab or two.
I have no idea why it's doing it, but if I do something like
string.gsub!(/\n/, "<br />")
The indentation is removed, so I know it has to do with the \n. But then my problem is that there are way too many line breaks and the format is then way off.
So then I tried to capture everything inside the pre tags with a method that looks like this
def remove_newlines(string)
regexp = /<pre>\s?(.*?)\s?<\/pre>/
code = regexp.match(string)
code[1].gsub!(/\n/, "<br />")
end
But I can't get that to work properly.
Anyone know how I can rid of this weird indentation problem, or any pointers on this?
Thanks!
It sounds like your template engine is auto-indenting the contents of the <pre> tags. Browsers render the whitespace inside <pre> tags as it is (and so they should, according to specs). This means that the whitespace at the beginning of each line inside the <pre> added by the template engine in order to make the HTML source more readable is rendered in the actual page as well, unlike whitespace most other places in HTML source.
The solution therefore depends on your templating language.
If you are using HAML:
HAML FAQ: How do I stop Haml from indenting the contents of my pre and textarea tags?
Hope this helps.