smarty variables inside javascript

Question

I am trying to use smarty variables inside javascript inside tpl

{literal}
<script language="javascript">
  google.load('visualization','1',{'packages': ['geomap']});
  google.setOnLoadCallback(drawMap);


  function drawMap() {
    var data = new google.visualization.DataTable();
    data.addRows(4);
    data.addColumn('string', 'Location');
    data.addColumn('number', 'Number of links');

{/literal}{foreach from=$last5 item=link name=links key=index}
    data.setValue({$index},0,'{$link.location|replace:'\'':'\\\''}');
    data.setValue({$index},1,{$link.location_count});
{/foreach}{literal}

    var options = {};
    options['dataMode'] = 'regions';
    options['region'] = 'world';

    var container = document.getElementById('map');
    var geomap = new google.visualization.GeoMap(container);

    geomap.draw(data, options);
  };
</script>
{/literal}

can you suggest me a solution please

-1 --- Your link expired - this really makes this post unusuable for me! — bastiandoeen, Oct 05 '10 at 11:32

score 13 · Accepted Answer · answered Aug 04 '10 at 10:56

13

Simply close the {literal} tag right before inserting the smarty variable, and re-open it again.

Or use {ldelim} and {rdelim} for the pieces of code where you assign values from Smarty.

answered Aug 04 '10 at 10:56

Alex

14,338
5
41
59

should i need to do it for foreach tag of smarty – soField Aug 04 '10 at 10:57
No Smarty tag can be placed inside {literal}{/literal}. When you need to place a foreach, a variable, an if, or anything else in Smarty, you must do it outside {literal}. If little JS is present, It might be better to omit the {literal}, and instead use {ldelim} and {rdelim} for literal curly brackets needed in JS. – Alex Aug 04 '10 at 10:59
i am really confused , i am trying lots of things but i could not manage to work it, can you please edit code and paste it for me – soField Aug 04 '10 at 11:11
Actually, your code should have worked. The only real thing I've changed is escaped the single quotes in one place. http://pastebin.com/J4ibLz1m Also tidied up a bit. – Alex Aug 04 '10 at 11:39
And something else. It is a VERY, VERY good practice to generate JSON server-side, using http://www.php.net/manual/en/function.json-encode.php . This way you won't have to escape anything, and you will only have to assign ONCE to a JS variable the JSON, then work with it in pure JS, with JS for, with absolutely no Smarty. – Alex Aug 04 '10 at 11:41
i tried your code but it did not work again, there must be strange thing , can we produce this code in different tpl and include it in this tpl ? – soField Aug 04 '10 at 11:53
ah simple crazy thing , ifound it and it works now , i changed data.addRows(4); to data.addRows(5); thanks – soField Aug 04 '10 at 12:13

karvonen · Answer 2 · 2015-05-13T11:38:58.563

7

{literal}
function doSomething(myNumber){
  var result = myNumber/{/literal}{$myDivider}{literal};
  // rest of code...
}
// more functions...
{/literal}

or

{literal}
function doSomething(myNumber){
{/literal}
   var result= myNumber/{$myDivider};
{literal}
  // rest of code...
}
// more functions...
{/literal}

or

function doSomething(myNumber){ldelim}
   var result= myNumber/{$myDivider};
   // rest of code below...
{rdelim}

function doSomeMore(another){ldelim}
   alert('{$myHello}');
   // more code
{rdelim}

OR (with Smarty 3.x and above, no literals etc necessary)

function doSomething(myNumber){
   var result = myNumber/{$myDivider};
   // rest of code 
}

In Smarty 3 a left curly brace with a space character (space, tab or newline) next to it should not mess with the Smarty logic any more. Problems solved by using the new version :)

edited May 13 '15 at 11:38

answered Oct 18 '10 at 15:40

karvonen

658
9
10

I've a similar situation here but little complex, look @ my code. `{literal}{/literal}` In this case it doesn't return full url but the value is retrieved.Any help? – Vijay Jul 12 '11 at 06:54
1

Well, at least you have "localhots", not "localhost". Moreover, 'localhost' may be unacceptable, see http://stackoverflow.com/questions/3707738/facebook-oauth-redirect-uri-problem-given-url-is-not-permitted-by-the-applicatio – karvonen Jul 25 '11 at 08:00
This approach `{/literal}{$myDivider}{literal}` worked out for me. – Divyang Jun 03 '17 at 08:24

Mohammed Joraid · Answer 3 · 2012-11-30T10:21:46.097

0

After trying (karvonen) answers [I did not try {rdelim} though, only tried {literal}], I got a problem with my ajax requests, it stopped fetching any date from server on loading after the smarty breaking in JS. So, what I did is I assigned the smarty value to a hidden field (I know this is not most smart thing to do) and then requested that value from JS and hence assigned it to a variable. Hope this helps.

edited Nov 30 '12 at 10:21

answered Nov 30 '12 at 10:06

Mohammed Joraid

6,202
2
27
38

smarty variables inside javascript

3 Answers3