How to take the data of an input text and put in a variable?

Asked

Viewed 183 times

-3

Example: Take a person’s name and put inside a variable, I tried using getElementById and etc, but I seem to lack a trigger after typing.

[1]: 

function enviar(){
var nome = document.getElementById('input_Nome')
var cpf = document.getElementById('input_Cpf')
var data_de_nascimento = document.getElementById('input_DataDeNascimento')
var endereço = document.getElementById('input_Endereço')
var fsex = document.getElementsByName('radsex') 
var fdeficiencia = document.getElementsByName('rad_deficiencia')
var res = document.getElementById('res')
var genero = ''
var deficiencia = ''
if (fsex[0].checked){
    genero = 'Homem'
}else if(fsex[1].checked){
    genero= 'Mulher'
}

if(rad_deficiencia[0].checked){
    deficiencia = 'Sim'
}else if(rad_deficiencia[1].checked){
    deficiencia= 'Não'
}
    
res.innerHTML =`${nome} `

}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Formulario</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        <h1>Formulário de internação</h1>
        
    </header>
    <main>
        <p>Digite o nome completo: <br/>
        <input type="text" name="" id="input_Nome">
        </p>

        <p>Digite o Cpf do paciente: <BR></BR>
        <input type="text" name="" id="input_Cpf">

        </p>
        <p>Digite sua data de nascimento: <br>
        <input type="date" name="" id="input_DataDeNascimento">
        </p>
        
        <p>Endereço: <br>
        <input type="text" name="" id="input_Endereço">
        </p>

        <p>Qual sexo: <br>
        <input type="radio" name="radsex" id="masc" checked>
        <label for="masc">Masculino</label>
        <input type="radio" name="radsex" id="fem">
        <label for="fem">Feminino</label>
        </p>

        <p>Possui alguma deficiencia? <br>
        <input type="radio" name="rad_deficiencia" id="sim" checked>
        <label for="sim">Sim</label>
        <input type="radio" name="rad_deficiencia" id="nao">
        <label for="nao">Não</label>
        </p>

        <p><input type="submit" value="Enviar" onclick="enviar()"></p>

        
        

    </main>
    <section>
        <h1>Consulta de paciente</h1>
       <p>Digite o CPF do paciente:
        <input type="search" name="" id="input_Pesquisa"> <br>
        <br>
        <input type="submit" value="Consultar">
       </p> 

       <div id="res">Resultado aqui</div>
    </section>
    
</body>
<script src="script.js"></script>
</html>

javascript html5

1 answer

0


To get the text of a <input> you must access the attribute value element. See the example below:

function hello(){
    name = document.getElementById("inputName").value;
    document.getElementById("inputName").value = `Olá ${name}, como você vai ?`;
}
<label>Nome de usuário: </label>
<input id = "inputName"type = "text"/>
<button onclick = "hello();">Olá :)</button>

Now, to access the text of other elements such as div’s, you must access the attribute innerHTML, thus:

function hello(){
    name = document.getElementById("name").innerHTML;
    document.getElementById("name").innerHTML = `Olá ${name}!`
}
<div id = "name">Lucas</div>
<button onclick = "hello();">Olá :)</button>

Browser other questions tagged javascript html5

You are not signed in. Login or sign up in order to post.