How to create dynamic route with parameter in a JavaScript function?

Question

One of my route is defined like this:

society_mybundle_searchpage:
    pattern:  /search/cp/{cp}
    defaults: { _controller: SocietyMyBundle:Search:searchByCP }

So it needs one parameter: {cp}.

Now I'd like to create a form with an input widget. So my code is like that:

  <form onsubmit="return search();" action="#">
    {{ form_rest(form) }}
  </form>

(Nothing specific, I let symfony do all the work for me). Note that this form calls a JS function: search(). So here's my code in twig:

<script type="text/javascript">
<!--
function verif_formulaire(){
    /* some code to get the value of the cp */
    ...
    /* then: */
    ss="{{ path('society_mybundle_searchpage', {'cp': '+cp+'}) }}";
    return true;
}
-->
</script>

The output is:

function verif_formulaire(){
    ss="/symfony/web/app_dev.php/pizzas/search/cp/+tt+";
    return true;
}

This is not the output I need. I want the output to be exactly like that this:

function verif_formulaire(){
    ss="/symfony/web/app_dev.php/pizzas/search/cp/"+tt+"/";
    return true;
}

How shall I proceed?

The path function always encode the url. To achieve what you want to do, you will have to do some work creating a new url_decode function or equivalent. This should help: stackoverflow.com/questions/10633676/… — cheesemacfly
– cheesemacfly, Commented Feb 23, 2013 at 16:29

Olivier Pons · Accepted Answer · 2013-02-26 22:55:07Z

My solution was: implement a custom url_decode function in twig (very easy).

Then use the format() function.

Here's the result:

window.location ="{{ path('my_path', {'cp': "%s" }) | url_decode | format('"+monCP+"') | raw }}";

Explanation: path('my_path', {'cp': "AAAA" }) will generate an URL like '/mypath/cp/AAAA/' thus path('my_path', {'cp': "%s" }) will generate an URL like '/mypath/cp/%s/'

But the '%s' will be escaped. So I decode it through '| url_decode' :

path('my_path', {'cp': "%s" }) | url_decode

Will generate proper string '/mypath/cp/%s/'.

Then I use the format() function to pass a string.

Example: '"/mypath/cp/%s/" | format('OLIVIER')' will give '"/mypath/cp/OLIVIER/"'

So, here, I pass a specific string: '"+monCP+"' (watch carefully the quotes and double quotes).

So: '"/mypath/cp/%s/" | format('"+monCP+"')' will give '/mypath/cp/"+monCP+"/'

Last problem: this whole string is again escaped. This time, a classical "| raw" is enough.

Thus, to conclude, this:

var xx ="{{ path('my_path', {'cp': "%s" }) | url_decode | format('"+monCP+"') | raw }}";

Will result in full normal JavaScript code:

var xx ="/my-symfony-url/cp/"+monCP+"/";

This may look complex, but wow. No external JavaScript file needed. This is what I wanted. Just pure fast Symfony 2 php-generated cache. I propably could make this a Twig macro or something.

nucleartux · Accepted Answer · 2013-02-23 14:24:18Z

0

As I can see you need generate route in JS. So maybe you need a FOSJsRoutingBundle?

answered Feb 23, 2013 at 14:24

nucleartux

1,4001 gold badge14 silver badges37 bronze badges

4 Comments

Olivier Pons Over a year ago

Hi, thank you for your answer, but I've got 2 problems: (1) it's symfony 2.0, and I'm more than surprised that we have to install external stuff just to generate URL in JS code (2) I did not find in the usage of the bundle here github.com/FriendsOfSymfony/FOSJsRoutingBundle/blob/master/… anywhere giving me sample of a JavaScript code which can ouput other things than "hardcoded" values (search for "You can do:" in the link i provide). Maybe it's the only solution but I dont know how I can use it.

Olivier Pons Over a year ago

May I ask you, maybe here, to give me a sample of "dynamic" JavaScript twig templating that could output a line like ss="/symfony/web/app_dev.php/pizzas/search/cp/ "+tt+" /";

Olivier Pons Over a year ago

I was expecting the function path to behave very closely to a sprintf() function...

Olivier Pons Over a year ago

Actually if I do something like {% set txt = '"+tt+"' %} then {{ txt|raw }}, it correctly ouputs "+tt+". So I'm very close with something like ss="{{ path('my_path', {'cp': txt }) }}"; but the output it still escaped, giving ss="/[blabla]/cp/%22+tt+%22";. I've tried |raw almost everywhere...

Collectives™ on Stack Overflow

How to create dynamic route with parameter in a JavaScript function?

2 Answers 2

Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related