JavaScript: Usando split() com select (combobox)

A ideia desse post é bem simples. Ao selecionar o nome no select o e-mail será preenchido no input.

Vamos precisar de um select (combobox), de um input e de uma função para automatizar o código.

split()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <script type="text/javascript">
        function selecionaEmail(select){
            // atribui o value do option selecionado
            var valorSelecionado = select.value;
            // usamos o split para fazer a separação 
            // e pegar o índice 1 do array
            // [0] = id / [1] = email
            var email = valorSelecionado.split("|")[1];
            // input com id email recebe o valor
            document.getElementById("email").value = email;
        }
    </script>
 
    <form name="">
        <label>Nome:</label>
        <select name="select" id="select" onchange="selecionaEmail(this)">
            <option value="" selected></option>
            <option value="1|fulano.de.tal@mail.com">Fulano de Tal</option>
            <option value="2|pedro.da.silva@mail.com">Pedro da Silva</option>
            <option value="3|josues.ferreira@mail.com">Josués Ferreira</option>
            <option value="5|cicrano.de.tal@mail.com">Cicrano de Tal</option>
            <option value="12|beltrano.de.tal@mail.com">Beltrano de Tal</option>
        </select>
        <br><br>
        <label>Email:</label>
        <input type="text" name="email" id="email">
    </form>
</body>
</html>

Veja o funcionamento desse script clicando aqui.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *