Pessoal, criei uma combo dinâmica utilizando JSon + Prototype.
Ela carrega, os Estados, os municipios, mas quando vai carregar a terceira combo as pequenas vai numa boa, as grandes como SP que tem 730 dados na lista ela não carrega, alguem tem alguma solução para isso.
Debugando eu vi que a lista chega bonitinha mas ele não consegue desenhar, provavelmente por causa de seu tamanho…
Combo dinâmica não aparece
10 Respostas
Amigo se fosse o meu caso eu faria uma combo extra pra filtrar as cidades pela letra inical, até pq uma combo com 730 itens detonaria a usabilidade do sistema… abraço…
É uma solução 
Realmente falaram isso aqui e tal o problema é que o cliente não quer, mas pelo visto não vai ter jeito.
Afe o cliente não quer com o filtro, não existe mesmo um meio de carregar uma combo assim com uma scroll bar do lado nao? :?:
Verifica qual a resposta do servidor em json, ou invoca diretamente a url ou verifica o console do firebug.
Talvez seja um timeout do Prototype.
Não faz o menor sentido, mas checa se a resposta do servidor está chegando como eu falei anteriormente.
Verifica qual a resposta do servidor em json, ou invoca diretamente a url ou verifica o console do firebug.Talvez seja um timeout do Prototype.
Não faz o menor sentido, mas checa se a resposta do servidor está chegando como eu falei anteriormente.
Olhei a saida da lista no firebug ela ta lá.
Entao Bregaida, tenta aquela lance do prototype de onLoading chama uma div com uma imagem carregando e onSuccess esconda a div e carrega a lista do jeito que ja esta:
http://www.prototypejs.org/learn/introduction-to-ajax
E la na funcao onde vc monta um innerHtml veja se consegue usar o new Ajax.Updater:
http://www.prototypejs.org/api/ajax/updater
Entao Bregaida, tenta aquela lance do prototype de onLoading chama uma div com uma imagem carregando e onSuccess esconda a div e carrega a lista do jeito que ja esta:http://www.prototypejs.org/learn/introduction-to-ajax
E la na funcao onde vc monta um innerHtml veja se consegue usar o
new Ajax.Updater:
http://www.prototypejs.org/api/ajax/updater
É mas no caso aki eu vou fazer ao invés de carregar a última lista, carrega um auto complete e resolve. melhor do q fazer aparecer 730 caras numa lista monstro…
Posta a sua função que cria o combo das cidades.
Posta a sua função que cria o combo das cidades.JSP
<logic:match name="dadosEmissaoForm" property="mostrarComboVaraDestino" value="true">
<br>
<table width="853" border="0" align="center" cellpadding="0" cellspacing="1">
<tr align="center" valign="middle">
<td height="20" align="left" class="titulo" colspan="5">Vara Destino</td>
</tr>
<tr align="center" valign="middle">
<td colspan="5" align="left" bgcolor="#F8D094" class="textotab2" height="1">
<img src="<%%>./img/pt_BR/transp2.gif" width="5" height="1"></td>
</tr>
<tr align="center" valign="middle">
<td align="left" class="textotab2" width="7" height="45"></td>
<td align="left" class="textotab2" width="99" height="45">Estado:</TD>
<td align="left" class="textotab" width="186" height="45" valign="middle">
<logic:match name="dadosEmissaoForm" property="habilitarEdicao" value="true">
<bean:define name="dadosEmissaoForm" property="listaEstado" id="liEstado" />
<html:select name="dadosEmissaoForm" property="codEstado" onchange="getMunicipios();">
<html:option value="">Selecione um Estado</html:option>
<html:options collection="liEstado" property="codigoEstado" labelProperty="nomeEstado" />
</html:select>
</logic:match>
<logic:notMatch name="dadosEmissaoForm" property="habilitarEdicao" value="true">
<bean:write name="dadosEmissaoForm" property="txtDescricaoEstado" />
<html:hidden name="dadosEmissaoForm" property="codEstado" />
</logic:notMatch>
</TD>
<TD align="right" class="textotab2" width="99" height="45">Município:</TD>
<TD align="left" class="textotab" width="186" height="45" valign="middle">
<logic:match name="dadosEmissaoForm" property="habilitarEdicao" value="true">
<DIV id="comboMunicipio">
</DIV>
</logic:match>
<logic:notMatch name="dadosEmissaoForm" property="habilitarEdicao" value="true">
<bean:write name="dadosEmissaoForm" property="txtDescricaoMunicipio" />
<html:hidden name="dadosEmissaoForm" property="codMunicipio" />
</logic:notMatch>
</TD>
</tr>
<tr align="center" valign="middle">
<td height="20" align="left" class="textotab2"> </td>
<TD height="20" align="left" class="textotab2">Vara de Destino:</TD>
<TD height="20" align="left" class="textotab">
<logic:match name="dadosEmissaoForm" property="habilitarEdicao" value="true">
<DIV id="comboVara">
</DIV>
</logic:match>
<logic:notMatch name="dadosEmissaoForm" property="habilitarEdicao" value="true">
<bean:write name="dadosEmissaoForm" property="txtDescricaoVaraDestino" />
<html:hidden name="dadosEmissaoForm" property="codVaraDestino" />
</logic:notMatch>
</TD>
<TD colspan="2" height="20" align="left" class="textotab"> </TD>
</tr>
</table>
</logic:match>
function getVaras() {
var url = 'ComboAninhadoServlet';
var pars = 'codMunicipio=' +$F("descricaoMunicipio")+'&action=listaVaraDestino';
var myAjax = new Ajax.Request(
url,
{
method: 'post',
parameters: pars,
onComplete: showVaras
}
);
}
function showVaras(data) {
var jsonObject = data.responseText.evalJSON();
var varas = jsonObject.varas;
var html = "<select name='descricaoVara' id='descricaoVara'>";
html+="<option value=''>--Selecione--</option>";
alert (varas);
for(i=0;i<varas.length;i++) {
html += " <option value='"+varas[i].id+"'>"+ varas[i].nomeVara + "</option>";
}
html += "</select>";
var div = document.getElementById("comboVara");
div.innerHTML = html;
}
private final void listaVaraDestino(HttpServletRequest request, PrintWriter out) {
BusinessInterfaceFactory businessFactory = BusinessInterfaceFactory.getInstance();
ComumBusinessInterface comumBusinessInterface = businessFactory.getComumBusinessInterface();
String codigo = request.getParameter("codMunicipio");
JSONObject json = new JSONObject();
List listaVaras = null;
try {
listaVaras = comumBusinessInterface.listarVara(Integer.parseInt(codigo));
System.out.println("Número de varas encontradas: " + listaVaras.size());
}
catch (BusinessException e1) {
LogManager.$app.debug("erro: "+e1);
}
List listaVaraJSon = new ArrayList();
for (int i = 0; i < listaVaras.size(); i++) {
Vara vara = (Vara) listaVaras.get(i);
JSONObject objetoJSon = new JSONObject();
try {
objetoJSon.put("id", vara.getCodVara());
objetoJSon.put("nomeVara", vara.getNomeVara());
} catch (Exception e) {
LogManager.$app.debug("erro: "+e);
}
listaVaraJSon.add(objetoJSon);
}
try {
json.put("varas", listaVaraJSon);
System.out.println(listaVaraJSon);
}
catch (Exception e) {
LogManager.$app.debug("Finalizando metodo [data-access-object-impl-class=br.gov.sp.prodesp.vec.web.ajax.ComboAninhadoServlet," + "method-name=listaVaraDestino()]" + "erro: "+e);
}
System.out.println(json.toString());
out.print(json.toString());
}
Adicione um out.flush() em sua Servlet.
Criado 3 de julho de 2009
Ultima resposta 6 de jul. de 2009
Respostas 10
Participantes 4
Alura POO: o que é programação orientada a objetos? Aprenda os conceitos básicos da programação orientada a objetos, como classes, objetos, herança, encapsulamento e polimorfismo, com exemplos.
Casa do Codigo JavaScript Assertivo: Testes e qualidade de codigo em... Por Gabriel Ramos — Casa do Codigo