Gostaria de saber como realizar a seguinte ação:
Quero que, ao selecionar um campo de uma lista de categorias, outra lista seja gerada com as subcategorias. Segue exemplo do site Mercado Livre, durante o processo de anúncio de um produto:
Como eu poderia criar o código javascript e html?
Esses são os códigos html que uso no documento view:
<div class="form-group">
<label class="col-sm-3 control-label" for="input-category"><span data-toggle="tooltip" title="<?php echo $help_category; ?>"><?php echo "Categorias"; ?></span></label> <!-- $entry_category -->
<div class="col-sm-9">
<select name="product_category" id="product-category" size="10" class="form-control">
<?php foreach($product_categories as $product_category){ ?>
<?php if($product_category['parent_id'] == 300 && $product_category['level'] == 0){ ?>
<option value="<?php echo $product_category['category_id']; ?>"><?php echo $product_category['name']; ?></option>
<?php } ?>
<?php } ?>
</select>
<select name="product_category" id="product-subcategory" size="10" class="form-control">
<?php foreach($product_categories as $product_category){ ?>
<?php if($product_category['parent_id'] == 59 && $product_category['level'] == 1){ ?>
<option value="<?php echo $product_category['category_id']; ?>"><?php echo $product_category['name']; ?></option>
<?php } ?>
<?php } ?>
</select>
</div>
</div>
Output:
Obs 1: o código html é um teste para a categoria Acessórios (category_id = 59) gerando as subcategorias dessa categoria (subcategorias com parent_id = 59), mas gostaria de saber como gerar uma lista para cada categoria selecionada.
Obs 2: no output é gerada a tabela das subcategorias mesmo sem clicar no campo Acessórios, diferentemente do Mercado Livre.
Alguém poderia me ajudar com isto? Preciso resolver o quanto antes.
Agradeço desde já a atenção e a ajuda!