I have a 'Phone Number' field in my web form.
I also have a 'hidden' form field which contains a unicode phone icon [☎].
Entering a phone number is optional for my site visitors.
So... if they chose not to enter a number in the phone number field of the form, I do not want the icon to be shown on the uploadResults.php page.
I only want the icon to appear if they enter data into the phone number field.
I have no idea how to achieve this. But I have included a stripped down version of the form, and the result [php] page in my question.
Any help would be greatly appreciated, as I will need to incorporate this same type of function in a few different areas of my site.
Thanks in advance.
Here is the form page code:
<!DOCTYPE html>
<html>
<head>
<title>The Form</title>
<style>
.container { margin-top:50px; margin-left:40px; }
.fieldTitle { font-family: Arial, Helvetica, sans-serif; font-size: 12pt; }
.phoneIcon { margin-bottom:10px; display:none;} /* This field hidden in form */
.phoneNumber { margin-top:10px; width:200px; height:25px; font-family:Arial, Helvetica, sans-serif; font-size: 12pt; }
.submitButton { margin-top:30px; font-family:Arial, Helvetica, sans-serif; font-size: 12pt; }
</style>
</head>
<body>
<form action="uploadResults.php" method="post" enctype="multipart/form-data">
<div class="container">
<div class="fieldTitle">Phone Number:</div>
<div><input class="phoneIcon" name="phoneIcon" id="phoneIcon" value="☎" readonly/></div>
<div><input class="phoneNumber" name="phoneNumber" id="phoneNumber" autocomplete="off"/></div>
<div><input class="submitButton" type="submit" name="submit" value="Submit"></button></div>
</div>
</form>
</body>
</html>
And here is the uploadResults.php page code:
<?php ob_start(); ?>
<!DOCTYPE html>
<html>
<head>
<title>Upload Results</title>
<style>
body{margin:0;}
.numberWrapper {margin: 100px 0px 0px 30px; }
.phoneIcon {font-size: 20px;}
.phoneNumber {font-family:Arial, Helvetica, sans-serif; font-size:12pt;}
</style>
</head>
<body>
<div class="numberWrapper">
<span class="phoneIcon"><?php $phoneIcon = ($_POST['phoneIcon']); echo $phoneIcon;?> </span>
<span class="phoneNumber"><?php $phoneNumber = ($_POST['phoneNumber']); echo $phoneNumber;?></span>
</div>
</body>
</html>
<?php echo ''; (ob_get_contents()); ?>
