Ajax and Jquery in Symfony

Question

I'm a beginner in Symfony (version 2), I have a project achieved with plain basic PHP, and now I'm redoing my pages in dealing with Symfony framework, and arrived to my jquery ajax functions, surely, things gonna be different, I used to do like this:

$("#div").click(function(){
  $.post("targetFile.php",{/*parameters*/,function(data){ });
});

Q: How to make that works on Symfony? What to put instead of targetFile.php? a route most probably. and what to do on the controller and router sides? I looked out on Google and here, but didn't get any clear answers. Regards.

Answer 1

You realy just have to replace the targetFile.php by a custom route of yours.

So if you have this in your routing.yml:

# app/config/routing.yml
hello:
    pattern:      /ajax/target
    defaults:     { _controller: AcmeHelloBundle:Site:index }

You can use this javascript:

$("#div").click(function(){
  $.post("/ajax/target",{/*parameters*/,function(data){ });
});

On the Symfony2 side, the method indexAction of the SiteController of the AcmeHelloBundle will be called.

Answer 2

If you set inside routing.yml this:

_admin_ajax:
    resource: "@SomethingAdminBundle/Controller/AjaxController.php"
    type:     annotation
    prefix:   /admin/ajax  

... and inside controller, that will handle ajax call this:

/**
 * @Route("/ajaxhandler", name="_admin_ajax_handler")
 */
public function handlerAction() {
    
    $isAjax = $this->get('Request')->isXMLHttpRequest();
    if ($isAjax) {
        //...
        return new Response('This is ajax response');
    }
    return new Response('This is not ajax!', 400);
}

... then inside for example TWIG template you should call it like this:

$("#div").click(function(){
  $.post("{{ url('_admin_items_add') }}",{/*parameters*/,function(data){ });
});

... and the real route for your action will be generated with templating engine.