Boa tarde amigos do GUJ!
Então, estou precisando criar um html com um form onde terão 2 campos Login e senha.
é apenas uma questão de implementação, não será usado para muita coisa.
Preciso fazer este campo de login e senha seja transformado em um objeto JSON e que quando clique em enviar apareça um alert com os valores de login e senha digitados.
fiz meu code mais ou menos assim:
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="css.css" type="text/css">
<script type="text/javascript" src="./pub/jquery-1.2.6.min.js"></script>
<script type="text/javascript">
var teste1 = document.getElementById('login');
var teste2 = document.getElementById('senha');
var json = '{"login": teste1,"senha": teste2}';
var dados = JSON.parse(json);
function alerta()
{
alert("Login: " + dados.login + "\nSenha: " + dados.senha);
}
</script>
</head>
<body>
<div class="py-5 w-100 h-100">
<div class="container">
<div class="row">
<div class="col-md-12">
<form class="" method="post" name="form">
<div class="form-group"> <label>Login</label>
<input type="login" placeholder="Digite seu login" name="login" class="form-control" id="login"> </div>
<div class="form-group"> <label>Senha</label>
<input type="password" placeholder="Digite sua senha" name="senha" class="form-control" id="senha"> </div>
<button type="submit" class="btn btn-primary" onClick="alerta()">Entrar</button>
<button type="reset" class="btn btn-cancel btn-warning">Cancelar</button>
</form>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"></script>
<script src="https://pingendo.com/assets/bootstrap/bootstrap-4.0.0-alpha.6.min.js"></script>
</body>
</html>
se alguém puder me auxiliar…
eu consigo fazer o alert sair se eu não instanciar a variável dentro do objeto JSON, caso eu instancie a var teste1 e var teste2 ele apenas faz o envio do form e não abre o alert.
quando eu coloco assim:
var json = '{"login": "teste1","senha": "teste2"}';
var dados = JSON.parse(json);
function alerta()
{
alert("Login: " + dados.login + "\nSenha: " + dados.senha);
}
é impresso na tela o alert Login: teste1 Senha: teste2
quando coloco assim:
<script type="text/javascript">
var teste1 = document.getElementById('login');
var teste2 = document.getElementById('senha');
var json = '{"login": teste1,"senha": teste2}';
var dados = JSON.parse(json);
function alerta()
{
alert("Login: " + dados.login + "\nSenha: " + dados.senha);
}
</script>
o alert não aparece mais…
fico no aguardo.
Atenciosamente.
Matheus Saad.
kkk