Tengo dos optgroup. Varias opciones en optgroup para Débito y otra para Crédito. Estoy tratando de crear una solución en Javascript para mostrarme un div cuando elijo una de las opciones de grupo de opciones de Débito y otro div cuando elijo una de las opciones de grupo de opciones de Crédito. ¡Nada funciona! Me pregunto si esta es la mejor solución una vez que necesito que el código también funcione cuando edito los datos.

Aquí está mi código en este momento:

 <select onchange="ChangeCategory(event)" type="text" name="rubrica" id="rubrica" class="form-control" required> <optgroup id="debit" label="DESPESAS"> <?php $result_rubrica = $dbcondo->query("SELECT * FROM lcs_tipo_rubrica WHERE tipo_rubrica='DÉBITO' order by rubrica ASC"); while($row_rubrica = $result_rubrica->fetch()){ $selected = "-- escolha uma opção --"; $output = '<option value="'.$row_rubrica['rubrica'].'" '.$selected.'>'.$row_rubrica['rubrica_id'].' '.$row_rubrica['rubrica'].'</option>'; echo $output; } ?> </optgroup> <optgroup id="credit" label="CREDITOS"> <?php $result_rubrica = $dbcondo->query("SELECT * FROM lcs_tipo_rubrica WHERE tipo_rubrica='CRÉDITO' order by rubrica ASC"); while($row_rubrica = $result_rubrica->fetch()){ //if($row_rubrica['bill_type'] == $_GET['$rubrica']){ $selected = "selected"; //}else{ // $selected = "-- escolha uma opção --"; //} $output = '<option value="'.$row_rubrica['rubrica'].'" '.$selected.'>'.$row_rubrica['rubrica_id'].' '.$row_rubrica['rubrica'].'</option>'; //Echo output echo $output; } ?> </optgroup> </select>

y el javascript

 function ChangeCategory({ target }) { if(selected && selected !== target.value) toggleDisplay(selected) selected = target.value return toggleDisplay(target.value, 'remove') }