Boa tarde!
Consegui manipular combos dinâmicos com sucesso, utilizando JQUERY e páginas que geram o JSON para os combos.
No entanto, estou com problemas quando o usuário acessa a página com o resultado e depois volta para a página com os filtros (usando o botão VOLTAR do navegador).
No Firefox os combos dinâmicos ficam carregados corretamente.
No IE não. Os combos dinâmicos perdem suas opções e a página fica em estado inconsistente (o combo no “topo” fica selecionado, mas o combo vinculado a ele ficam sem valores).
Já tentei disparar o evento “change” artificialmente, mas não obtive sucesso.
Como contornar esse problema?
Consegui fazer todos os combos voltarem ao estado inicial, mas o cliente quer que os combos mantenham as opções previamente selecionadas.
<script type="text/javascript">
//executa no onload
$(document).ready(
//carrega combos do formulário
function() {
if (typeof jQuery == 'undefined') {
alert("Falha no carregamento da biblioteca de scripts do site\n" +
"Contate o administrador");
return;
}
}
);
$(function(){
$("select#produto").change(
function(){
if ($("select#produto").val() == -1) return;
var optionsWait = "<option selected='selected' value='-1'>Carregando opções...</option>";
$("select#origem").html(optionsWait);
$.getJSON("json/RecuperaListaLocais_PorProduto.php",{produto: $(this).val()}, function(j){
var options = "<option selected='selected' value='-1'>Selecione o local de origem</option>";
if (j.length > 0) {
for (var i = 0; i < j.length; i++) {
options += "<option value=\"" + j[i].optionValue + "\">" + j[i].optionDisplay + "</option>";
}
} else {
options = "<option selected='selected' value='-1'>Não foram localizados locais de origem</option>";
}
$("select#origem").html(options);
});
});
});
$(function(){
$("select#origem").change( function(){
if ($("select#origem").val() == -1) return;
var optionsWait = "<option selected='selected' value='-1'>Carregando opções...</option>";
$("select#data_vigencia").html(optionsWait);
$.getJSON("json/RecuperaListaDatas_PorProdutoEOrigem.php",{codorigem: $(this).val(), produto: $("select#produto").val() }, function(j){
var options = "<option selected='selected' value='-1'>Selecione a data de vigência</option>";
if (j.length > 0) {
for (var i = 0; i < j.length; i++) {
options += "<option value=\"" + j[i].optionValue + "\">" + j[i].optionDisplay + "</option>";
}
} else {
options = "<option selected='selected' value='-1'>Não foram localizadas datas de vigência</option>";
}
$("select#data_vigencia").html(options);
});
});
});
$(function(){
$("select#data_vigencia").change( function(){
if ($("select#data_vigencia").val() == -1) return;
var optionsWait = "<option selected='selected' value='-1'>Carregando opções...</option>";
$("select#modalidade").html(optionsWait);
$.getJSON("json/RecuperaListaModalidades_PorDataProdutoEOrigem.php",{codorigem: $("select#origem").val(), produto: $("select#produto").val(), data_vigencia: $(this).val() }, function(j){
var options = "<option selected='selected' value='-1'>Selecione a modalidade</option>";
if (j.length > 0) {
for (var i = 0; i < j.length; i++) {
options += "<option value=\"" + j[i].optionValue + "\">" + j[i].optionDisplay + "</option>";
}
} else {
options = "<option selected='selected' value='-1'>Não foram localizadas modalidades</option>";
}
$("select#modalidade").html(options);
});
});
});
</script>