Why jquery ajax request returns 404 in ZF2

Question

I have a Zend Framework 2 Form and try to create a dependable Dropdown. So after choosing the Maincategory, I use AJAX to jump to my Controller load the subcategories and return them via JSON. I had already a solution for ZF1 but with ZF2 I keep getting the Error 404 not found.

I try to call up the action loadsubcategory in the advert controller which belongs to the advert model. For all my pages, I have routes. I am really confused now my understanding is that I stay on the page itself, so in my eyes I would not need a route for the AJAX request. My URL is currently http://myproject.local/create/advert and here my ajax call:

$.ajax({
        url: '/advert/loadsubcategory/',
        data: { id: categoryID},

Why do I get the 404?

blackbishop · Accepted Answer · 2022-01-03 23:38:24Z

If you're getting Error 404 not found so the controller or the action you're calling doesn't exists.

First : Looks like the url you're using in the Ajax request is wrong. It should be :

  url : '/advert/loadsubcategory',

And not :

  url : '/advert/loadsubcategory/'

It shouldn't be a / at the end of the url.

Second : To avoid any error in your url, you can get the exact url inside your Zend view file and then pass it as a parameter to your dependentDropDown function like this :

<script type="text/javascript">
$(document).ready(function() {
var ajax_url = "<?= $this->url($this->route, array('controller'=>'advert', 'action'=>'loadsubcategory'));?>";
dependentDropDown(source_id, target_id, ajax_url);
});
</script>

Assuming that you have a dependentDropDown function which looks like this :

dependentDropDown = function(source,target,url){            
    $('#'+source).change(function() {
            $.ajax({
                type:  'POST',
                async: true,
                url:   url,
                cache: true,
                dataType: 'json',
                data:  {id: $('#'+source).val() },
                success: function(data){
                    //success function, populating the target with data
                },
                error: function(jqXHR,textStatus,errorThrown){
                    var error = $.parseJSON(jqXHR.responseText);
                    var content = error.content;
                    console.log(content.message);
                    if(content.display_exceptions)
                        console.log(content.exception.xdebug_message);
                },
                
            });
    });
}

And inside your AdvertController :

public function loadsubcategoryAction(){
    $request = $this->getRequest();
    if ($request->isPost())
    {
        $categoryID= $request->getPost('id', null);

        $data = new JsonModel(array(
                'success' => true,
                'results' =>$subcategories, //<---- your data to return
        ));
        return $data;
    }

}

Thanks a lot!! My route was the problem, see comment below. My jQuery function looks a bit different, but I hope this is okay, as long it works. I now get the $data returned, I will only have to get now the $subcategories filled and the second dropdown populated. Thanks again, you pushed me in the right direction with confirming that a AJAX request would not need their own route. Thanks !

Luka · Accepted Answer · 2014-08-10 20:59:52Z

0

After 2 days searching for a solution I found out that I have to create a route for the AJAX request. Please see my updated route below. I am not sure if this is the best solution, but it seems to work.

 'advertform' => array(
                    'type'    => 'Literal',
                    'options' => array(
                            'route'    => '/create/advert',
                            'defaults' => array(
                                    // Change this value to reflect the namespace in which
                                    // the controllers for your module are found
                                    '__NAMESPACE__' => 'Advert\Controller',
                                    'controller'    => 'Advert',
                                    'action'        => 'create',
                            ),
                    ),
                'may_terminate' => true,
                'child_routes' => array(
                    'profile' => array(
                        'type'    => 'Segment',
                        'options' => array(
                            'route'    => '/loadsubcategory[/:id]',
                            'defaults' => array(
                                'action' => 'loadsubcategory',
                            ),
                            'constraints' => array(
                                'id' => '[0-9]*'
                            ),
                        ),
                    ),
                ),              
        ),

answered Aug 10, 2014 at 20:59

Luka

7582 gold badges9 silver badges42 bronze badges

2 Comments

blackbishop Over a year ago

NO, you don't have to create a specific route for ajax request.

Luka Over a year ago

@blackbishop, Okay, I found the mistake. My route caused the issue. I can not explain it proper, but I had to change it from Literal to Segement and then 'route' => '/create/advert[/:action][:id]', now the AJAX Action is found. Thanks so much !!

Collectives™ on Stack Overflow

Why jquery ajax request returns 404 in ZF2

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related