Habilitar select dinâmico quando opção for selecionada

[Hisoka. 0]

Boa tarde!

Eu tenho um select para categoria e um para subcategoria. O select de subcategoria só exibe as subcategorias se categoria for selecionado. Eu qria que enquanto categoria não for selecionado, o select subcategoria fique desabilitado ou com readonly="true".

AJAX:

function buscar_subcategoria(idcategoria){
          $.post(base_url+"/index.php/subcategoria/subcategoria_controller/ajax_dados_subcategoria", {
            idcategoria : idcategoria
            }, function(data){
            $('#subcategoria').html(data);
            });
        }

HTML:

  <div class="form-group">
			    <label for="categoria">Categoria</label>
                            <select class="form-control" name="categoria_fk" id="categoria_fk" required="required" onchange='buscar_subcategoria($(this).val())'>
                                
                                <option value="">Selecione uma categoria</option>
                                <!--AQUI!-->
                                 <?php foreach ($categoria -> result() as $linha): ?> 
                                
                                <option value="<?php echo $linha->idcategoria?>"><?php echo $linha->nomecategoria?></option>
                                
                                <?php endforeach;?>
                                
                            </select>
			  </div>
                            
                             
                            <div class="form-group">
                            <label for="exampleSelect1">Subcategoria</label>
                            <select class="form-control" name="subcategoria_fk" id="subcategoria">
                             <option value="">Selecione uma categoria</option>
                                <!--AQUI!-->
                                 <?php foreach ($subcategoria -> result() as $linha): ?> 
                                
                                <option value="<?php echo $linha->idsubcategoria?>"><?php echo $linha->nomesubcategoria?></option>
                                
                                <?php endforeach;?>
                            </select>
                          </div>

PHP:

 function ajax_dados_subcategoria($idcategoria){
            
            $this->load->model('subcategoria/subcategoria_model');
            
            $dados = $this->subcategoria_model->m_ajax_dados_subcategoria($idcategoria);
            
            $option = "<option value=''></option>";
            foreach($dados -> result() as $linha) {
            $option .= "<option value='$linha->idsubcategoria'>$linha->nomesubcategoria</option>"; 
            }

            echo $option;
            
        }