When I put SMARTY variable between {literal}{$txt_more}{/literal} in Jquery then in source code it display right text (více without quotes) but in console it show this error:
ReferenceError: v\u00EDce is not defined - this error I thought is because it is not in quotes
but when I put it into quotes {literal}'{$txt_more}'{/literal} it show in source code as 'více' but not display as text between tags strong with class show_text (tags are empty inside). Can you help me ? Thank you very much.
Jquery with SMARTY:
$('.show_text').text({/literal}'{$txt_more}'{literal}); // verison with quotes is without error but still not display text between tags with class show_text
$('.show_text').text('show more'); // with show more typed it displays as it should on website
HTML:
<a href="#">
<strong class="show_text" style=" margin-top: 5px; text-align:center; overflow:hidden;white-space:nowrap;position:absolute; z-index:2"></strong>
<img style="position:relative;" class="cond-arr" src="/css/showmore.png" alt="show_more" />
</a>
Wrong quoting, should be:
$('.show_text').text("{/literal}{$txt_more}{literal}");
If you're using Smarty 3, you don't need {literal} anymore, just make sure that there is always a space after any { in your code
If using smarty 2, you don't need to be so specific with literal, remember that the problem is only when there is a "{". Your code will look much cleaner with one of this solutions:
{/literal}
$('.show_text').text('{$txt_more}');
{literal}
or using a javascript variable at the start of your code and surrounding everything else with literal just to be safe
txt_more='{$txt_more}';
{literal}
...
$('.show_text').text(txt_more);
...
{/literal}
Related
I'm awful with javascript and I'm having a problem with this one.
I'm using this code
<script>
function changeNavigation(id){
document.getElementById('members')
.innerHTML=document.getElementById(id).innerHTML
}
</script>
and HTML
`<span onClick="changeNavigation('members')" >MEMBERS</span>
<span onClick="changeNavigation('help')" >HELP</span>`
<div id="members>...</div>
<div id="help" style="display: none;>...</div>
But I can't get <span onClick="changeNavigation('members')" >MEMBERS</span> to actually go to an element "members" without duplicating everything inside of it in another id.
Is there a way to do this?
This can be done using only standard javascript, but personally I'd recommend going ahead and getting used to using jQuery. Here's an example jsfiddle using jQuery: http://jsfiddle.net/JnvCR/2/
Don't forget to include jQuery in your website:
<script src="http://code.jquery.com/jquery.js"></script>
You need to correct your syntax errors. Use onclick instead of onClick (pedantic). Make sure you close your attributes properly, you are missing a few closing " marks.
updated html
<span onclick="changeNavigation('members')" >MEMBERS</span>
<span onclick="changeNavigation('help')" >HELP</span>`
<div id="members">...</div>
<div id="help" style="display: none;">...</div>
There is also an error with your logic as you are simply replacing the contents of div#members with itself.
Updated JS without syntax errors, but still with dodgy logic
function changeNavigation(id){
document.getElementById('members').innerHTML=document.getElementById(id).innerHTML;
}
Demo fiddle
http://jsfiddle.net/ADGCV/
As far as your actual question goes, can you explain what you would like to happen a bit better??
Here's a possible solution http://jsfiddle.net/ADGCV/1/
I'm experimenting with the < pre> and < code> tags in html 5 as I would like to include some code snippets on my website. I'm using the page below as a test page but it is not displaying anything. Any reason why?
<body>
<div style="color:#000000">
<pre>
<code>
<script type="text/javascript">
$('#inputField').hide();
</script>
</code>
</pre>
</div>
</body>
It was my understanding that using these new tags would negate any code that they contain within however this does not appear to be the case.
Cheers,
J
These tags are only for "decorational" purposes. Code within will still be executed. If you want it displayed you have to convert at least the <script> tag to html:
<script type="text/javascript">
Then the JavaScript code inbetween will be shown.
You don't need both though, I would use <pre> (which is per default a block element), <code> is intended for inline use.
Remove script tag:
<body>
<div style="color:#000000">
<pre>
<code>
$('#inputField').hide();
</code>
</pre>
</div>
</body>
It was my understanding that using these new tags would negate any code that they contain
They don't. They tell user agents to present the data as code. So it will have font changes, white space will be significant, it should be skipped over by translation software and so on.
Markup still takes effect (so you can add elements to style, or link the code to other places, and so on) so you still need to replace HTML special characters (<, &, etc) with their respective entities (<, &, etc).
This would work if you take the script tags out.
These code tags only change the font of the text inside to a monospace font, however it does not override the interpretation of other tags (or even php tags).
A better way is to use CSS to get color highlighting, or javascript libraries.
I just started using Mustache and I like it so far, but this has me perplexed.
I am using the GitHub gist API to pull down my gists, and part of what I want to do is include the embedding functionality into my page. The problem is Mustache seems to not want to have anything to do with my dynamic script tag.
For example, this works fine:
<div class="gist-detail">
{{id}} <!-- This produces a valid Gist ID -->
</div>
Additionally, this works perfect:
<div class="gist-detail">
<script src='http://gist.github.com/1.js'></script> <!-- Produces the correct embed markup with Gist ID #1 -->
</div>
If I try to pull these together, something goes terribly wrong:
<div class="gist-detail">
<script src='http://gist.github.com/{{id}}.js'></script> <!-- Blows up! -->
</div>
Chrome Inspector shows this:
GET https://gist.github.com/%7B%7Bid%7D%7D.js 404 (Not Found)
... which looks like to me something is weird with escapes or whatnot, so I switch over to the raw syntax:
<div class="gist-detail">
<script src='http://gist.github.com/{{{id}}}.js'></script> <!-- Blows again! -->
</div>
And I get the same result in Inspector:
GET https://gist.github.com/%7B%7B%7Bid%7D%7D%7D.js 404 (Not Found)
How do I get the correct values to embed in the script tag?
EDIT
I am injecting the template as follows (in document.ready:
function LoadGists() {
var gistApi = "https://api.github.com/users/<myuser>/gists";
$.getJSON(gistApi, function (data) {
var html, template;
template = $('#mustache_gist').html();
html = Mustache.to_html(template, {gists: data}).replace(/^\s*/mg, '');
$('.gist').html(html);
});
}
The actually template is inside of a ruby partial, but it is wrapped in a div (not a script tag, is that a problem?) (that's hidden):
<div id="mustache_gist" style="display: none;">
{{#gists}}
<!-- see above -->
{{/gists}}
</div>
I assume a div is ok rather than a script because in either case, I'm pulling the .html(). Is this a bad assumption?
To avoid automatic escaping in Mustache use {{{token}}} instead of {{token}}.
It seems like your template is in HTML and trying to retrieve the template using html() results in a pre-URL-escaped template to be returned. Try placing your template inside a <script type="text/html"> tag instead.
When you embed your template inside an HTML element that excepts more HTML elements as children, it may get processed by the browser as HTML. Escaping may occur. By using a <script> tag with a non-script content type, you're basically telling the browser not to touch your template.
It looks like your script is getting requested before Mustache has a chance to update the src property. What you want to do is define the template in a way that it's not parsed as part of the DOM. A common approach is to define your template inside of a <textarea> tag. This will preserve formatting and prevent character escaping.
<textarea id="gist-detail-template" style="display:none">
<script src='http://gist.github.com/{{id}}.js'></script>
</textarea>
Now, to instantiate the template:
var template = $('#gist-detail-template').val();
var html = Mustache.to_html(template, yourTemplateData);
Here's an official example: http://mustache.github.com/#demo
I want my Smarty template with this code:
<h3>{$playlist->title|purify}<\
/h3>
to produce this:
<h3>desiredstring<\
/h3>
I've attempted any number of ways of inserting single quotes around the smarty variable ({$playlist->title|purify}) to no avail. I always get an unquoted string like this:
<h3>desiredstring<\
/h3>
Any thoughts about how to get this tag wrapped is greatly appreciated!
You just put the quotes in the HTML template, around the Smarty tag like so:
<h3>
<a href="http://www.test.com"
onclick="RemoteLogger.logGAEvent('Homepage', 'ClickTop10',
'{$playlist->title|purify}');">
{$playlist->title|purify}
</a>
</h3>
I have some html code rendered on the server side. This is passed to a jsp which renders a javascript-call with this html:
<script type="text/javascript">
window.parent.${param.popup_return}("${helpId}", "${content}");
</script>
content is like
"
This is a <p class="xyz">test</p>
"
My problem is that - according to the quotes in 'content' - the javascript-call is wrong as it is rendered to
<script type="text/javascript">
window.parent.${param.popup_return}("ybc", "This is a <p class="xyz">test</p>");
</script>
Does anyone know how I can solve this (besides manually replacing all quotes)?
Use a JSON encoder to create the encoded strings.
But you'll also have to ensure that the output doesn't contain the sequence </ in string literals, which is invalid in a <script> block (</script is the version that will also break browsers).
Many JSON encoders either by default or optionally will encode to <\/ or \u003C/ to avoid this problem.
I use this:
<div id="result" style="display:none">
${content}
</div>
<script type="text/javascript">
window.parent.${param.popup_return}("${helpId}", dojo.byId("result").innerHTML);
</script>
This seems to work perfectly
You aren't using JSTL here (you originally tagged the question with only JSTL). You are using EL in template text. It get printed plain as-is. You'd like to use JSTL core <c:out> to escape predefined XML entities (which also works for HTML in this particular case, quotes is among the escaped XML entities).
window.parent.${param.popup_return}("<c:out value="${helpId}" />", "<c:out value="${content}" />");
An alternative (if you hate that the JSP syntax highlighter or validator bugs/jerks about nested tags/quotes) is the JSTL function fn:escapeXml():
window.parent.${param.popup_return}("${fn:escapeXml(helpId)}", "${fn:escapeXml(content)}");
Have you tried using single quotes instead of double quotes? i.e. changing "${content}" to '${content}'