Image input does not send the form?

1

People, I'm having a submit problem with input type image, it's simply not recognized as submit and does not send data to be processed by POST.

Below are the ways that did not work.

Attempting to "Submount" with input id:

<input type="image" name="botao" id="buttonSubmit" onClick="document.getElementById('buttonSubmit').submit();" src="css/img/buttonImg.png" style="width:223px;height:41px"/>

Getting the form and trying to give submit

<input type="image" name="botao" id="buttonSubmit" onClick="document.getElementById('formulario').submit();" src="css/img/buttonImg.png" style="width:223px;height:41px"/>

Normal without js:

<input  type="image" name="botao" id="buttonSubmit" src="css/img/buttonImg.png" style="width:223px;height:41px" />

I tried all the ways I saw on the net but none worked, so I'm turning to you!

How did it work:

<input type="submit" value="Cadastrar" id="buttonSubmit" name="botao"/>

The way above works perfectly ... but I want to use an image as a submit ... and I can not do it at all!

Where are the coffee addicts to help me?

My full code:

<?php
 require ("includes/connection.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> KNAUTILUZ </title>
</head>
<body>
<link href="css/main-index.css" rel="stylesheet">
<img src="css/img/backmenu.png" alt="" title="" id="field0"/>
<script type="text/javascript" src="js/pegarValor.js"></script>
<img src="css/img/gameLogo.png" alt="" title="" id="gameLogo"/>
<div id="text" >Knautiluz é um jogo online de navegador (browser).<br>Trazendo uma proposta inovadora de um RPG de mesa.<br> Cada jogador pode ser o que desejar, tudo depende de <br> sua imaginação.</div>
<div id="upperMenu"></div>
<form name="formulario" id="formulario" action="" method="post">
<label id="nomediv">Nome</label>
<input type="text" required placeholder="SEU NOME" name="name" id="name" pattern="[A-z]{3,}" maxlength="12">
<br>
<label id="sobrenomediv">Sobrenome</label>
<input type="text" required placeholder="SOBRENOME" name="surname" id="surname" pattern="[A-z]{3,}" maxlength="12">
<br>
<label id="nascimentodiv">Nascimento</label>
<input type="date" required  name="birthday" id="birthday" min="1915-01-01" max="2006-01-01"> 
<br>
<label id="sexdiv">Sexo</label>
<select name="sex" id="sex">
<option value="Male">MASCULINO</option> 
<option value="Female">FEMININO</option>
</select>
<br>
<label id="userdiv">Usuário</label>
<input type="text" required placeholder="USUARIO" name="username" id="username" pattern="[A-z]{3,}" maxlength="15">
<br>
<label id="emaildiv">E-mail</label>
<input type="email" required placeholder="[email protected]" name="email" id="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$">
<br>
<label id="senhadiv">Senha</label>
<input type="password" required placeholder="SENHA" name="password" id="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" title="Precisa ter pelo menos uma letra maiúscula uma letra minúscula, um numero e 6 ou mais caracteres">
<input type="hidden" name="status" id="status" value="1">
<br>
<label id="csenhadiv">Confirme a senha</label>
<input id="repassword" name="repassword" type="password" required  placeholder="CONFIRME A SENHA" title="Coloque a senha igual a anterior para confirma-la" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" title="Precisa ter pelo menos uma letra maiúscula uma letra minúscula, um numero e 6 ou mais caracteres" oninput="validaSenha(this)" />
<br>
<br>
<br>
<input type="image" name="botao" id="buttonSubmit" onClick="this.form.submit();" src="css/img/buttonImg.png" style="width:223px;height:41px"/>
<br>
<br>
</form>
</body>
</html>
<?php
if(isset($_POST["botao"])) {
$name        =  mysqli_real_escape_string($mysqli, $_POST["name"]);
$surname     =  mysqli_real_escape_string($mysqli, $_POST["surname"]);
$birthday    =  mysqli_real_escape_string($mysqli, $_POST["birthday"]);
$sex         =  mysqli_real_escape_string($mysqli, $_POST["sex"]);
$username    =  mysqli_real_escape_string($mysqli, $_POST["username"]);
$email       =  mysqli_real_escape_string($mysqli, $_POST["email"]);
$password    =  mysqli_real_escape_string($mysqli, $_POST["password"]);
$repassword  =  mysqli_real_escape_string($mysqli, $_POST["repassword"]);

if($name == "" || $surname == "" || $birthday == "" || $sex == "" || $username == "" || $email == "" || $password == "" || $repassword == "") {
echo "<script> alert('Preencha todos os campos.'); </script>";
return true;
}
if($password != $repassword) {
echo "<script> alert('As senhas devem ser iguais!'); </script>";
return true;
}
// FAZ A BUSCA NO BDD PRA VER SE O EMAIL JA EXISTE
$select = $mysqli->query("SELECT * FROM data WHERE email='$email'");
if(select) {
$row = $select->num_rows;
if ($row > 0) {
echo "<script> alert('Já existe um usuário com este e-mail!'); </script>";
} else {
// FAZ A BUSCA NO BDD PRA VER SE O USUARIO JA EXISTE
$select = $mysqli->query("SELECT * FROM data WHERE username='$username'");
if(select) {
$row = $select->num_rows;
if ($row > 0) {
echo "<script> alert('O Usuário já existe.'); </script>";
} else {
// CASO TUDO ESTIVER OK ELE INSERE AS INFORMAÇÕES NO BDD
$insert = $mysqli->query("INSERT INTO 'data'('name', 'surname', 'birthday', 'sex', 'username', 'email', 'password', 'status') VALUES ('$name', '$surname', '$birthday', '$sex', '$username', '$email', '".md5($password)."', '0')");
if($insert) {
echo "<script> alert('Usuario registrado com sucesso!'); location.href='login.php' </script>";
}}}
else {
echo $mysqli->error;
}}
}}
?>

I'm new to this and I do not know why this is happening, thank you very much for anyone trying to help me!

    
asked by anonymous 03.04.2016 / 07:54

2 answers

2

All cases have a different problem.

When you use input of type image it generates two values, X and Y.

Example:

<form method='post'>
    <input type='image' src='/caminho/para/imagem' name='biscoito'>
</form>

This will send a POST with biscoito.x and biscoito.y .

So you're declaring an invalid condition of type:

if(isset($_POST["biscoito"])) { }

The biscoito will never exist, but in its place there will be biscoito.x and biscoito.y , simple as well.

In this case use the condition:

if(isset($_POST["biscoito.x"], $_POST["biscoito.y"])) { }
// OU 
if(isset($_POST)){ }

I would solve the problem.

Note:

  

I changed the name from botao to biscoito so that the   button input with the name button, I think so you can understand the problem easier!

But what about JavaScript?

So, by using .submit() (or similar) you ignore the name of the button itself, so you will not send the name that is chosen in 'input!     

03.04.2016 / 14:07
1

Put a value in no input so it's not working right here and it worked <input type="image" value="cadastrar">

    
03.04.2016 / 15:24