0

Tenho um formulario para cadastro de dependentes de um plano, onde pode escolher filho, marido, sogro, etc.. e depois o ano de nascimento

Queria que, ao selecionar qual o grau de parentesco, ele vá alterando os options do select, ex:

Selecionar filho: Máximo ano atual | Mínimo - 35 anos (1982 a 2017)
Pai/mãe:  Máximo ano atual - 12 | Mínimo ano atual - 100 (1917 a 2005)
Outros: Máximo ano atual | Mínimo ano atual - 100 (1917 a 2017)

Pode usar php, javascript, jquery, qq um.

Consegui apenas criar uma regra, não sei como atrelar ao outro select:

<select id="grau_parentesco">
<option value="filho">Filho(a)</option>
<option value="pai">Pai</option>
<option value="mae">Mãe</option>
<option value="outros">Outros</option>
</select>
<select id="ano"></option>
<?
$ano_inicial = date("Y");
$qtd = 35;
for($i=0; $i <= $qtd; $i++){
    $ano = $ano_inicial-$i;
    $ano = sprintf("%02s",$ano);
    echo "<option value=\"".$ano."\">".$ano."</option>\n";
}
?>
</select>
3
  • Você quer dizer dessa forma?
    – BrTkCa
    Commented 11/12/2017 às 12:11
  • Ou esta: pt.stackoverflow.com/a/14668/43731
    – tkmtts
    Commented 11/12/2017 às 12:15
  • exato, mas a diferença é que preciso que gere os anos automaticamente, pra que independente do ano que a gente esteja, ele gere todos os anos, para que eu não precise alterar o código todo ano Commented 11/12/2017 às 12:16

1 Resposta 1

2

Segue um exemplo utilizado JQuery e uma lógica simples, deixei as regras em um switch para facilitar, caso queria adicionar outras.

$("#grau_parentesco").on('change', function () {

        //Selecionar 
        //filho: Máximo ano atual | Mínimo - 35 anos (1982 a 2017)
        //Pai / mãe:  Máximo ano atual - 12 | Mínimo ano atual - 100(1917 a 2005)
        //Outros: Máximo ano atual | Mínimo ano atual - 100(1917 a 2017)


        var maxValue = (new Date()).getFullYear();
        var minValue = maxValue - 100;

        switch ($(this).val()) {
            case "pai":
            case "mae":
                maxValue -= 12;
                break;
            case "filho":
                minValue = maxValue - 35;
                break;
            default:
                break;
        }
        
        //limpa
        $("#ano").find("option").remove();

        //popula
        for (var ano = minValue; ano <= maxValue; ano++) {
           $('#ano').append($('<option>', {
                value: ano,
                text: ano
            }));
        }

    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id="grau_parentesco">
  <option value="">Selecione</option>
  <option value="filho">Filho(a)</option>
  <option value="pai">Pai</option>
  <option value="mae">Mãe</option>
  <option value="outros">Outros</option>
</select>

<select id="ano">
</select>

3
  • perfeito, isso mesmo. só mais uma frecurite..rs, como faço para aparecer os anos invertido, o primeiro option de cima do filho por exemplo ser 2017 Commented 11/12/2017 às 12:50
  • é só inverter a população, (var ano = maxValue; ano >= minValue ; ano--) Commented 11/12/2017 às 12:53
  • Perfeito, obrigado! Commented 11/12/2017 às 12:55

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .