<div class="form-group">
    <label for="">Category List <i id="multilevel-dp" style="display:none" class="fa fa-spinner fa-spin"></i></label>
    <?php 
        $list = [];
        $list['My own client list'] = ['0'=>'My own client list'];
        
        if(!empty($affiliate_client_list)){
            $list['My Own Affiliate List'] = $affiliate_client_list;
        }
        
        if(!empty($employee_list)){
                $list['Employee List'] = $employee_list;
        }
        if($_SESSION['userType'] == CMS_USER_INDICATOR){
            if(!empty($affiliate_client_list)){
                $list['My Own Affiliate List'] = $affiliate_client_list;
            }
            if(!empty($employee_affiliate_list)){
                $list['Affiliate List'] = $employee_affiliate_list;
            }
        }
        
        echo $this->Form->select('employee_category_id',$list, ['empty'=>false,'label' =>false,'onchange'=>'changeClientListByCategory(this)','class' => 'form-control','default'=>$crmuser_id]); 
    ?>
    
    <!--<span><img id="multilevel-dp" style="position:absolute" src="<?php echo $this->Url->build('/images/ajax-loader.gif'); ?>"></span>-->
</div>   

<script>
     function changeClientListByCategory(elem)
    {
        var data = {};
        var id = $(elem).val();
        id =  parseInt(id);
        var action_name = "";
        var label_name = $(elem).find('option:selected').parent('optgroup').attr('label');
        var move_type = "";
        data['own_client'] = 0;
        if(label_name == "My own client list"){
            action_name = "GET_OWN_CLIENT_LIST";
            data['own_client'] = 1;
        }else if(label_name == "My Own Affiliate List"){
            action_name = "AFFILIATE_CLIENT_LIST";
            data['crmuser_id'] = id;
        }else if(label_name == "Affiliate List"){
            action_name = "AFFILIATE_CLIENT_LIST";
            data['crmuser_id'] = id;
        }else if(label_name = "Employee List"){
            action_name = "EMPLOYEE_CLIENT_LIST";
           data['employee_id'] = id;
        }
        
        var DEFAULT_CLENT_LIST = '<?php echo  addslashes(json_encode($clients)); ?>';
        var conf  = true;
        if(data['own_client'] == 1){
            var default_response = JSON.parse(DEFAULT_CLENT_LIST); 
            generateClientList(default_response)
            
            conf = false;
            return ;
        }
        
        data['action'] = action_name;
        if(conf){
            $('#multilevel-dp').show();
            $.ajax({
                type: 'POST',
                url: '<?php echo $this->Url->build('/invoice/index/'); ?>',
                data: data,
                success: function (data) {
                    $('#multilevel-dp').hide();
                    var response = JSON.parse(data);
                    if(action_name == "EMPLOYEE_CLIENT_LIST"){
                        response = response.employee_client_list;
                    }
                    generateClientList(response);
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                     $('#multilevel-dp').hide();
                }
            });
        }else{
            //$(elem).prop('selectedIndex', 0);
        }
    }
    
    
    function generateClientList($clientList){
        var clientDropdown = $("#invoice-client-id");
        clientDropdown.empty()
        $('<option />', {value: "", text: "Please select client"}).appendTo(clientDropdown);
        for(var val in $clientList) {
            $('<option />', {value: val, text: $clientList[val]}).appendTo(clientDropdown);
        }
    }
</script>