Thursday, April 25, 2024
 Popular · Latest · Hot · Upcoming
97
rated 0 times [  98] [ 1]  / answers: 1 / hits: 145351  / 11 Years ago, fri, june 7, 2013, 12:00:00

I am trying to write a registration page and I am having the hardest time.



<form  action=insert.php method=post>
<h1>Registration:</h1>
<input type=text name=first placeholder=First name>
<input type=text name=last placeholder=Last name><br />
<input type=text name=username placeholder=Username> <br />
<input type=password name=password placeholder=password> <br />
<input type=password name=confirmPass placeholder=Confirm Password> <br />
<input type=submit value=Register>
</form>


This is my code on the registration page. How do I call my JavaScript function and have it still post and do the action? I made this as a simple module which is separate but I would want to merge them



<input id=pass1 type=password placeholder=Password style=border-radius:7px; border:2px solid #dadada; /> <br />
<input id=pass2 type=password placeholder=Confirm Password style=border-radius:7px; border:2px solid #dadada;/> <br />

<script>
function myFunction() {
var pass1 = document.getElementById(pass1).value;
var pass2 = document.getElementById(pass2).value;
if (pass1 != pass2) {
//alert(Passwords Do not match);
document.getElementById(pass1).style.borderColor = #E34234;
document.getElementById(pass2).style.borderColor = #E34234;
}
else {
alert(Passwords Match!!!);
}
}
</script>

<button type=button onclick=myFunction()>Sumbit</button>


I do not need help merging them, I know I would have to switch some things around, but if they are together, how do I call the JavaScript function?



This will be done more neatly after I figure out what to do, So what would be the best way to call my JavaScript function and if it is successful proceed to post and action part of the form. I could ditch the submit button and just do a button type that calls the JavaScript function but what happens if it works or not? I essentially (at this point) want to make sure the passwords are the same and if not, don't move forward to the insert.php but if they do match, the pass the form data along to insert.php


More From » html

 Answers
6

Just add onsubmit event handler for your form:



<form  action=insert.php onsubmit=return myFunction() method=post>


Remove onclick from button and make it input with type submit



<input type=submit value=Submit>


And add boolean return statements to your function:



function myFunction() {
var pass1 = document.getElementById(pass1).value;
var pass2 = document.getElementById(pass2).value;
var ok = true;
if (pass1 != pass2) {
//alert(Passwords Do not match);
document.getElementById(pass1).style.borderColor = #E34234;
document.getElementById(pass2).style.borderColor = #E34234;
return false;
}
else {
alert(Passwords Match!!!);
}
return ok;
}

[#77751] Thursday, June 6, 2013, 11 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
editha

Total Points: 564
Total Questions: 107
Total Answers: 109

Location: Finland
Member since Fri, Oct 21, 2022
2 Years ago
;