I am trying to construct a registration form using the code below, I am still in the beginning phase. I am having a really difficult time executing any of the JavaScript code that is within the PHP echo statement.
I tried escaping the single and double quotes within the javascript functions using the slash \' and \", which worked for the top javascript function, but once I added the other two functions and applied the same logic, all javascript functions stopped working.
Can someone please advise what is the easiest way to prevent problems and easily execute javascript code that is within a php echo statement?
<?php
echo '
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
function validateEmail(email) {
var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if(re.test(email)) {
document.getElementById(\'result\').innerHTML = \'<img src=\"http://www.customotion.com/green_check_small.png\" style=\"width:15px;\"/> Valid\';
} else {
document.getElementById(\'result\').innerHTML = \'<img src=\"http://biglistbigsales.com/m/templates/GPT/images/x_xMarkRed4.png\" style=\"width:15px;\"/> Invalid\';
}
}
</script>
</head>
<body>
<div id="main-container">
<div id="body-container" style="padding-bottom:150px; height:800px;">
<div style="height:100px; margin:0px auto;">
<img class="reg-step" style="width:100%;" src="images/step1.png">
</div>
<div style="margin-left:110px;">
<span style="font-size:24px;" class="smallheading">Tell Us About Yourself</span>
<br/><span style="font-size:13.5px;"><i>*All fields required</i></span>
</div>
<form method="post" action="registernew.php">
<div style="margin:0px auto; margin-left:110px; border:1px solid blue; float:left; font-size:12px; width:500px;">
<div style="border:1px solid blue; float:left; width:80%;">
<div style="float:left; border:1px solid red;">
First Name:
<br/><input type="text" style="width:140px;" name="fname" />
</div>
<div style="float:right; margin-right:50px; border:1px solid red;">
Last Name:
<br/><input type="text" style="width:140px;" name="lname" />
</div>
</div>
<div style="border:1px solid blue; float:left; margin-top:20px; width:50%;">
<div style="float:left; border:1px solid red;">
City:
<br/><input type="text" style="width:170px;" name="fname" />
</div>
<div style="float:right; border:1px solid red;">
State:
<br/>';
include('inc/statedropdown.inc.php');
echo' </div>
</div>
<div style="float:left; width:100%;">
<br/>Company Name:<br/> <input type="text" name="fname" style="width:150px;"/>
<br/><br/>E-mail Address:<br/> e-mail:<br/><input id="email" type="text" onblur="validateEmail(this.value)" /><span id="result"></span>
<br/><br/>Phone Number:<br/> <input type="text" name="fname" style="width:110px;" />
<br/><br/>Password:<br/><input type="password" name="fname" />
<br/><br/>Confirm Password:<br/><input type="password" name="lname" />
<br/><input type="submit" value="Next Step" style="background-color:#ebda5f; color:blue; margin:15px 0px 0px 20px;">
</div>
</form>
</div>
</div>
</div>
</body>
</html>';
?>
Only use the
<?php ?>tags when they’re needed. Anything not inside the tags gets echoed and treated like HTML.