Page 1 of 1

execute javascript onclick or onsubmit?

Posted: Fri Dec 18, 2009 5:32 pm
by scatty1985
Hi,

I'm learning PHP Javascript and HTML. I've been playing with a piece of code that will pass a password from a user to the $_POST global but some Javascript must first hash the password before the next page can sanitise and submit the data to a database.

I have some code which does it using the onclick event for a button. But I have tried to adapt the code to use a submit button and run when the onsubmit event is called. However, for reasons I don’t know the latter doesn’t seem to work... Can anyone explain why?

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sign up</title>
<script type="text/javascript" src="sha-512.js"></script>
 
<script type="text/javascript">
 
function encode() {
    var iForm = document.getElementById("inputForm");
    var sForm = document.getElementById("submitForm");
    sForm.username.value = hex_sha512(iForm.pass.value);
    sForm.submit();
    }
 
</script>
 
</head>
 
<body>
<h1>Sign up</h1>
<form id="inputForm" action="#" method="post">
<table>
<tr><td>Username : </td><td><input type="text" name="username" /></td></tr>
<tr><td>Password : </td><td><input type="password" name="pass" /></td></tr>
<tr><td colspan="2" align="center"><input type="button" name="submit" value="Submit" onclick="encode();" /></td>
</table>
</form>
 
<form id="submitForm" action="submit.php" method="post">
<input type="hidden" name="username" />
<input type="hidden" name="password" />
</form>
 
 
</body>
</html>
 
This is what doesnt work... When I click submit the page stayes the same...

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sign up</title>
<script type="text/javascript" src="sha-512.js"></script>
 
<script type="text/javascript">
 
function encode() {
    var iForm = document.getElementById("inputForm");
    var sForm = document.getElementById("submitForm");
    sForm.username.value = hex_sha512(iForm.pass.value);
    sForm.submit();
    }
 
</script>
 
</head>
 
<body>
<h1>Sign up</h1>
<form id="inputForm" action="#" method="post" onsubmit="encode();">
<table>
<tr><td>Username : </td><td><input type="text" name="username" /></td></tr>
<tr><td>Password : </td><td><input type="password" name="pass" /></td></tr>
<tr><td colspan="2" align="center"><input type="submit" name="submit" value="Submit" /></td>
</table>
</form>
 
<form id="submitForm" action="submit.php" method="post">
<input type="hidden" name="username" />
<input type="hidden" name="password" />
</form>
 
 
</body>
</html>

Re: execute javascript onclick or onsubmit?

Posted: Fri Dec 18, 2009 5:36 pm
by AbraCadaver
I don't think you use this: sForm.submit();

If I remember correctly, in an onsubmit routine you return true; to submit the form or return false; to cancel submission of the form.