CODEWITHSUNDEEP
phpjqueryajaxsymfony
user7424312
user7424312

Reputation: 137

Ajax request in symfony no return

I have this template :

<div class="save-icon" style="margin-top: 2%">
   <a href="" onclick="changeNumber({{ number.getId }})">Link</a>
</div>

The js :

{% block javascript %}
{{ parent() }}
<script type="text/javascript">
    function changeNumber(id){
        console.log(id);
        $.ajax({
            type: "POST",
            url: "{{path('numbers_update')}}",
            data: { id:id},
            success: function(msg){
                //alert( "Data Saved: " + msg );
            }
        });
    }
</script>
{% endblock %}

In the source of page I have : 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script type="text/javascript">
    function changeNumber(id){
        console.log(id);
        $.ajax({
            type: "POST",
            url: "/app_dev.php/admin/numbers/update",
            data: { id:id},
            success: function(msg){
                //alert( "Data Saved: " + msg );
            }
        });
    }
</script>

The config for numbers_update route :

numbers_update:
path: /numbers/update
defaults: { _controller: ClientBundle:Admin/NumbersBlock:update }
requirements:
    _method:  POST

The methode updateAction()

public function updateAction(Request $request){
    $i_id = $request->request->get('id');
    $em = $this->getDoctrine()->getManager();

    return $this->json(array());
}

I use basic authentification, so I'm added this call in the security.yml :

access_control:
 - { path: ^/admin/homepage, roles: ROLE_ADMIN }
 - { path: ^/admin/numbers, roles: ROLE_ADMIN }
 - { path: ^/admin/numbers/update, roles: ROLE_ADMIN }

I'm logged now but I don't get a retourn after ajax request.

Please help me ! I don't understand what can be the problem. Do you have some ideas ? ...Thx in advance.

Upvotes: 0

Views: 1022

Answers (3)

userfuser
userfuser

Reputation: 1418

You're missing a return false on one of two possible places in your handler. Either do this:

 onclick="changeNumber({{ number.getId }}); return false;"

or 

 onclick="return changeNumber({{ number.getId }});"

If you go with the 2nd solution - you'll need to add a return false; at the end of your changeNumber function.

The problem here is that, when you click on this <a>, the call to your handler actually works and it probably does the AJAX call, but you don't see it. Since you are not preventing the default behavior of an a.click, the page actually follows the link given in the href (besides calling your handler) and you leave the current page (or possibly go again to same one).

Whether you go to different page or the same one, the WebDeveloper tool will most likely refresh and you won't see the AJAX call listed.

A tip for WebDeveloper tool: it may help to also enable the not-clearing of the Console and Network tabs between page submits and refreshes.

Upvotes: 1

coffey
coffey

Reputation: 11

<a href="" onclick="changeNumber({{ number.getId }})">Link</a>

I suggest you modify the href link, your href = "", When you click on this page will refresh again. Even if you go away ajax. Because the refresh the page, you also look not to come out. You can instead Href = "javascript:;" Elsewhere, and then you according to the normal way of thinking to write.

Upvotes: 0

Constantin
Constantin

Reputation: 1304

I think you have to :

use Symfony\Component\HttpFoundation\JsonResponse;

and

return new JsonResponse(array('key' => 'value' ));
//instead of 
return $this->json(array());

Clear cache to be sure.

In chrome, you can find more about the error in "network" tab in developper tools (when you use ajax).

Upvotes: 0

Related Questions