How to take data from an input and add the properties of a Javascript function?

Asked

Viewed 345 times

2

I’m having a lot of personal doubts. I would like to take data from my input and place it within properties of a function. If the function could be performed ( capture all data) would display a success message, already in case of error an error message. I’m trying to do the function however, I can’t tell if it’s getting the inputs correctly or not.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Cadastro de usuário</title>
  </head>
 <body>
<h1> Formulário de Cadastro </h1>
<form name="form">
  <input type="text" name="name" placeholder=" Type your name." maxlength="30"><br><br>
  <input type="number" name="age" placeholder=" Type your age." min="18" maxlength="65"><br><br>
  <input type="email" name="email" placeholder="Type your email."><br><br>
  <input type="password" name="password" placeholder="Type your password."><br><br>
  <input type="button" name="button" value="Cadastrar" onclick="return validarUser()">
  <script language="javascript" src="./scripts.js"></script>
</form>

Javascript code

function validarUser(params){
  var name = form.name.value,
      age = form.age.value,
      email = form.email.value,
      password = form.password.value;
    return true;
    if (validarUser() == true) {
      console.log("Cadastro realizado com sucesso.");
    } else {
      console.log(" Erro ao fazer o cadastro");
    }
}
javascript html

1 answer

1


It seems there’s something wrong with your code. You’re giving return true without at least doing any checking. It is calling function validarUser within itself, causing a pile burst. Another problem is that to call the function within onclick it is necessary to use parentheses onclick="return validarUser()"

Try to do something like this:

function validarUser(){
    
    // você recupera as informações do formulário
    var name = form.name.value,
        age = form.age.value,
        email = form.email.value,
        password = form.password.value;
    
    // verifica cada variável para ver se tem conteúdo ou não
    if (name && age && email && password) {
      console.log("Cadastro realizado com sucesso.");
    } else {
      console.log(" Erro ao fazer o cadastro");
    }
    
}
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Cadastro de usuário</title>
  </head>
 <body>
<h1> Formulário de Cadastro </h1>
<form name="form">
  <input type="text" name="name" placeholder=" Type your name." maxlength="30"><br><br>
  <input type="number" name="age" placeholder=" Type your age." min="18" maxlength="65"><br><br>
  <input type="email" name="email" placeholder="Type your email."><br><br>
  <input type="password" name="password" placeholder="Type your password."><br><br>
  <input type="button" name="button" value="Cadastrar" onclick="return validarUser()">
  <script language="javascript" src="./scripts.js"></script>
</form>

Browser other questions tagged javascript html

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