[RESOLVIDO] Remover opções dinamicamente de selects!

Front-end
#1

E aí, galerinha do GUJ. Tudo bem?
Preciso fazer remoção de itens de selects dinamicamente, mas não tenho ideia de como começar.
A ideia é:

Eu tenho lá, por exemplo, três selects:[code]

1ª opção 2ª opção 3ª opção 4ª opção 1ª opção 2ª opção 3ª opção 4ª opção 1ª opção 2ª opção 3ª opção 4ª opção [/code] Ao selecionar [b]1ª opção[/b] no select1, queria removê-la dos selects 2 e 3. Se eu selecionar a [b]2ª opção[/b] no select1, gostaria que voltasse a [b]1ª opção[/b] que foi removida. Tô tentando fazer algo desse tipo, mas não tá saindo.

Alguém tem alguma luz aí?
Valeu, galera,
fiquem com Deus! :smiley:

#2

Javascript não ajuda?

#3

Ajuda, sim, mas não tô tendo ideia de onde partir, saca? Tá escuro pra mim, ainda. haha

#4

Ajuda, sim, mas não tô tendo ideia de onde partir, saca? Tá escuro pra mim, ainda. haha[/quote]
Que tal fazer um negócio meio antiquado e estudar?
Aqui é um ótimo lugar para começar

#5

Ajuda, sim, mas não tô tendo ideia de onde partir, saca? Tá escuro pra mim, ainda. haha[/quote]
Que tal fazer um negócio meio antiquado e estudar?
Aqui é um ótimo lugar para começar[/quote]
Obrigado pela dica, mas Javascript eu conheço. Queria uma dica, uma luz, de COMO fazer a situação.

#6

Opa, Bom dia amigo…

Fiz aqui mais ou menos… Você pode melhorar… só fiz pra você ter uma ideia…

Veja se te serve.

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

<script>
	function mudaSelect() {

		if (formSelect.select1.value == 1) {

			formSelect.select2.options[0] = null;
			formSelect.select2.options[1] = null;
			formSelect.select2.options[2] = null;
			formSelect.select2.options[3] = null;

			formSelect.select2.options[0] = new Option("2º opção", "2");
			formSelect.select2.options[1] = new Option("3º opção", "3");
			formSelect.select2.options[2] = new Option("4º opção", "4");

		} else if (formSelect.select1.value == 2) {

			formSelect.select2.options[0] = null;
			formSelect.select2.options[1] = null;
			formSelect.select2.options[2] = null;
			formSelect.select2.options[3] = null;

			formSelect.select2.options[0] = new Option("1º opção", "1");
			formSelect.select2.options[1] = new Option("3º opção", "3");
			formSelect.select2.options[2] = new Option("4º opção", "4");

		}

	}
</script>


</head>
<body>

	<form name="formSelect">
		
                <select id="select1" onchange="mudaSelect();">
			<option value="1">1ª opção</option>
			<option value="2">2ª opção</option>
			<option value="3">3ª opção</option>
			<option value="4">4ª opção</option>
		</select> 

                <select name="select2" id="select2">
			<option value="1">1ª opção</option>
			<option value="2">2ª opção</option>
			<option value="3">3ª opção</option>
			<option value="4">4ª opção</option>
		</select> 

                <select id="select3">
			<option value="1">1ª opção</option>
			<option value="2">2ª opção</option>
			<option value="3">3ª opção</option>
			<option value="4">4ª opção</option>
		</select>

	</form>

</body>
</html>
#7

Obrigado pela resposta, rsmoraes. Consegui finalizar a lógica que precisava. Pode não estar “padronizado” ou coisa do tipo, mas, por hora, funciona deste modo:[code]function contains(valor, array) {

for (count = 0; count < array.length; ++count) {
    if (array[count] == valor)
        return true;
}

return false;

}

function atualizarOpcoesCursos(select, numeroCursosDisponiveis) {

var virgula = select.val().indexOf(',');
var valorSelecionado = select.val().substr(0, virgula);
var cursoSelecionado = select.val().substr(virgula, select.val().length);

var selecionados = '';
$("#cursos li select").each(function (i, item) {
    var selecionado = $(item).val().substr(0, $(item).val().indexOf(','));
    if (selecionado != -1)
        selecionados += selecionado + ',';
});

var arr = selecionados.split(',');

$("#cursos li select").each(function (i, item) {

    var virgula = $(item).val().indexOf(',');
    var valor = $(item).val().substr(0, virgula);
    var curso = $(item).val().substr(virgula, select.val().length);

    if ($(item).val() != select.val()) {
        var valorAnterior = $(item).val();

        if (valor == -1) {

            var options = "<option value='-1," + curso + "'></option>";
            for (i = 1; i <= numeroCursosDisponiveis; ++i) {
                if (valorSelecionado != i && !contains(i, selecionados)) {
                    options += "<option value='" + i + "," + curso + "'>Opção " + i + "</option>";
                }
            }
            options += "<option value='0," + curso + "'>Não quero</option>";

            $(item).children("option").remove();
            $(item).html(options);
            $(item).val(valorAnterior);
        }
    }
});

}[/code]
Valeu!

#8