Cakephp ajax request without reload page

Question

I have a table of categories and subcategories that I need, when the product is added and the user selects a category of my choice, the following list of subcategories should display only those subcategories that have ... I use ajah in my admint.ctp everything seems fine but my controller does not receive ajah request

$('#category_id').change(function(){
        $('.typecategories-select').fadeIn('slow');
        var category_data = $(this).val()
        console.log(category_data)
        $.ajax({
            type: "POST",
            url: '<?php echo $this->Url->build(['controller' => 'Products', 'action' => 'add','plugin'=>'admin']); ?>',
            data: {category_id:category_data},
            success: function(data){
                console.log('AjaX Success')
                // console.log(data)
            },
            error: function(){alert('AjaX Failed')}
        });


    });
    
    }
    
    
    
    
    //ProductsController
public function add()
    {
    if ($this->request->is('post')){
            $a = 'ajax success';
            echo $a;
        }
        if ($this->request->is('put')){
            $a = 'ajax success';
            echo $a;
        }
        if ($this->request->is('ajax')) {
            $a = 'ajax success';
            echo $a;
        }
        else{
            echo $value = $this->request->getData('category_id');
            echo $value;
            $a = 'a';
            echo $a;
//here only return $a after i change #category_id but its ajax request wtf?

        }
        if ($this->request->is('json')){
            $a = 'ajax success';
            echo $a;
        }
        
}