Twig and jQuery/Javascript

[greg]

I know that Twig templates are "compiled" into PHP file, but I wonder how can I do that for my project:

jQuery file:

Code: Select all

var catId=$(this).attr("rel");
var DATA = 'catId=' + catId;
$.ajax({
           type: "POST",
           url: "{{ path('showSubCategory', {"cat": catId })  }}",
              data: DATA,
              cache: false,
              success: function(data){
                $(".div-sous-cat[rel=" + catId + "]").html(data);
              }//success
 });//ajax

Of course in this line:

Code: Select all

{{ path('showSubCategory', {"cat": catId })  }}"

catId is undefined since its in Twig.

My goal is to route to a different path, differents routes are given with the "catId" variable.
Any ideas? thx

[dreipunktnull]

Check out the FOSJsRoutingBundle. Works great.

[greg]

That seems to be perfect for my needs, I will check that.

Thanxx.

[guyaloni]

I try to use the FOSJsRoutingBundle, which indeed looks like a very good and clean solution.

Problem - I get the following error (it's a javascript error):

Uncaught Error: The route "xxx" does not exist

I have a routing.yml under app/config which imports the routing.yml of my bundle.

Any ideas???

[greg]

Sorry, finally I haven't used FOSJsRoutingBundle; I found a simpler solution for my issue.

Anyway, just a simple search for your term "xxx" in your project could help to identify where the is the pb.

[guyaloni]

I change the message to xxx, originally the error message mention the name of the route (which I do have in my routing file...)

Greg, can you tell me what was the solution you found please? Thanks!

[guyaloni]

Silence... so I got my own solution.

Having some route like:

Code: Select all

_delete_user:
    pattern:  /delete-user/{_user_id}/{_username}
    requirements:
        _user_id:  \d+
        _method:  POST


I simply add:

Code: Select all

_delete_user_ajax:
    pattern:  /delete-user/_user_id/_username
    requirements:
        _method:  POST


(notice that instead of declaring _user_id and _username as parameters, I declare them as plain text).

Then in the template I do the following:

Code: Select all

<script>
{% if _user_id is defined and _user_id is not null %}
{% set deleteUserUrl = url('_delete_user_ajax') %}
var myUrl = '{{deleteUserUrl}}';
{# this is the tricky part... #}
myUrl = myUrl.replace('_user_id', 'dd').replace('_username', username);
$.ajax({
  url: myUrl,
     :
     :
  }
});
{% endif %}
</script>


BTW, In this implementation you don't reveal your routing file, which must be passed in some way to client if you use the FOSJsRoutingBundle...