Ampliar listas con JS

[julia2021]

Yupiiiii !, les cuento que ya lo pude solucionar, aquí les dejo la respuesta por si acaso a alguien le pueda servir.

En HTML coloque más opciones en el OnChange:

Código HTML:

<select autofocus id="id_cliente" name="id_cliente" onChange="selectChange(this, form.id_contrato, arrContratos, arrContratosId, form.id_sucursal, arrSucursales, arrSucursalesId);" class="select2_group form-control" required="required">
 <option value="">Seleccione un cliente.......

En JS me puse a armar otro select con los nuevos parametros recibidos del HTML

Código Javascript:

<? // INICIO: LISTAS DEPENDIENTES: CLIENTE >> CONTRATO ///////////////////// ?>
<? // INICIO: LISTAS DEPENDIENTES: CLIENTE >> SUCURSAL ///////////////////// ?>
<SCRIPT LANGUAGE="JavaScript">
var arrContratos    = new Array();
var arrContratosId  = new Array();
var arrSucursales   = new Array();
var arrSucursalesId = new Array();
 
<? // Armamos la lista desplegable de los CONTRATOS
foreach ($_agreements as $clave => $contrato) {
    echo 'arrContratos['.$contrato['id_contrato'].'] = "'.$contrato['nombre'].' ('.$contrato['codigo'].')'.'"';echo "\n";
    echo 'arrContratosId['.$contrato['id_contrato'].'] = '.$contrato['id_cliente'];echo "\n";
}
?>
<? // Armamos la lista desplegable de los SUCURSALES
foreach ($_offices as $clave => $sucursal) {
    echo 'arrSucursales['.$sucursal['id_sucursal'].'] = "'.$sucursal['nombre'].' ('.$sucursal['id_sucursal'].')'.'"';echo "\n";
    echo 'arrSucursalesId['.$sucursal['id_sucursal'].'] = '.$sucursal['id_cliente'];echo "\n";
}
?>
function selectChange(control, controlToPopulate, ItemArray, GroupArray, controlToPopulate2, ItemArray2, GroupArray2)
{
    // Armamos la lista de CONTRATOS
    var myEle ;
    var x ;
    // Empty the second drop down box of any choices
    for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
    // ADD Default Choice - in case there are no values
    myEle = document.createElement("option") ;
    myEle.value = 0 ;
 
    if (control.name == "id_cliente") {
        myEle.text = "Seleccione el contrato..." ;
    }
    controlToPopulate.add(myEle) ;
    // Now loop through the array of individual items
    // Any containing the same child id are added to
    // the second dropdown box
    for ( x = 0 ; x < ItemArray.length  ; x++ )
    {
        if ( GroupArray[x] == control.value )
        {
            myEle = document.createElement("option") ;
            myEle.value = x ;
            myEle.text = ItemArray[x] ;
            controlToPopulate.add(myEle) ;
        }
    }
 
    // Armamos la lista de SUCURSALES
    var myEle2 ;
    var x2 ;
    // Empty the second drop down box of any choices
    for (var q2=controlToPopulate2.options.length;q2>=0;q2--) controlToPopulate2.options[q2]=null;
    // ADD Default Choice - in case there are no values
    myEle2 = document.createElement("option") ;
    myEle2.value = 0 ;
 
    if (control.name == "id_cliente") {
        myEle2.text = "Seleccione la oficina..." ;
    }
    controlToPopulate2.add(myEle2) ;
    // Now loop through the array of individual items
    // Any containing the same child id are added to
    // the second dropdown box
    for ( x2 = 0 ; x2 < ItemArray2.length  ; x2++ )
    {
        if ( GroupArray2[x2] == control.value )
        {
            myEle2 = document.createElement("option") ;
            myEle2.value = x2 ;
            myEle2.text = ItemArray2[x2] ;
            controlToPopulate2.add(myEle2) ;
        }
    }
}
//  End -->
</script>
<? // FINAL: LISTAS DEPENDIENTES: CLIENTE >> CONTRATO ///////////////////// ?>
<? // FINAL: LISTAS DEPENDIENTES: CLIENTE >> SUCURSAL ///////////////////// ?>
 

Espero les sirva a alguien. Besos a todos, Bye.