Combos dinâmicos no JSP

Depois de muito penar, descobri como fazer combobox dinâmicas para JSP.
No exemplo, eu quero que um combo, chamado 'cidade' exiba as cidades contidas no banco, de acordo com o estado que eu selecionar na combo 'uf'.

1º passo: Criar uma página jsp, que faça uma busca na tabela 'cidade', passando como parâmetro (preferencialmente via get) o código da uf:

try{
   int codigoUf = Integer.parseInt(request.getParameter("codigo").toString());
   List lista = Busca.listaCidades(codigoUf);
   out.print("[");
   for(int i = 0; i < lista.size(); i++){
      if (i != 0) out.print(", "); 
      out.print("'" + lista.get(i).getNome() + "'");  
   }
   out.print("]");
   conexao.close();
} catch (NumberFormatException e){}

obs.: Se o java imprimisse a lista diretamente, ficaria no formato "[ item, item, item ]". Mas o javascript, pelo menos aqui, não reconheceu esse formato. Por isso, eu fiz essa mini gambiarra, para que a saída seja "[ 'item', 'item', 'item' ]", como no PHP.

2º passo: Agora, no HTML, basta colocar o seguinte atributo na tag select:

onchange="buscaCidade(this.options[this.selectedIndex].value)"

3º passo: Criar o javascript:

function buscaCidade(tuf){
   try{
      xmlhttp = new XMLHttpRequest();
   } catch(e1) {
      try{
         xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      }catch(e2){
         try{
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }catch(e3){
            xmlhttp = false; //Viva a padronização dos browsers
         }
      }
   }

   //limpa a combobox
   var c = document.getElementById("cidade")
   while( c.options.length > 0) c.options[0] = null
   c.options[0] = new Option(" -- Aguarde ... -- "," -- Aguarde ... -- ")

    //Monta a url com a uf
   xmlhttp.open("GET", "buscacidade.jsp?codigo=" + tuf, true);
   xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4){
         var c = document.getElementById("cidade")
         while(c.options.length > 0) c.options[0] = null
         //Transforma a lista de cidades JSON em Javascript
         var aCidades = eval((xmlhttp.responseText))
         //popula o select com a lista de cidades obtida
         for(var i = 0; i < aCidades.length; i++){
            aCidades[i] = unescape(aCidades[i])
            c.options[c.options.length] = new Option(aCidades[i],  aCidades[i])
         }
      }
   }
   xmlhttp.send(null)
}

Segundo meus cálculos, agora deve funcionar... Para testar, crie dois combos (uf e cidade), e popule um banco =]

Observações:

1) De repente, você pode precisar utilizar o código da cidade juntamente com o nome, para efetuar cadastros e tals. No exemplo de cima, o jsp só busca o nome da cidade. Pra fazer ele buscar também o código, concatene ele com o nome da cidade, utilizando um caracter bem estranho para separá-los:

out.print("'" + lista.get(i).getCodigo() + "#" + lista.get(i).getNome() + "'");

Daí no .js você coloca:

var str = aCidades[i].split("#");
c.options[c.options.length] = new Option(str[1], str[0])

Onde str[0] (código) será o value do select, e str[1] (nome) será o valor exibido na combo.

2) De repente também, você precise utilizar este javascript em mais de uma combo. Para isso, é só passar o nome do combo que você quer carregar via parâmetro:

onchange="doBusca(this.options[this.selectedIndex].value, 'cidade')"

E alterar o javascript pra receber esse parâmetro.

3) Peguei esse código daqui, e adaptei um pouco =D.

É isso, té mais o/