I have created a form to accept registration of users. What I want is to make the content of the form show in another page when the submit button is clicked - so that the user can view the details of the form and print.
<form action="sendresult.php" method="post" name="form2" id="form2" autocomplete="on">
<p align="center"><img src="images/headerform.jpg" width="691" height="135"></p>
<p align="center"><strong style="font-size: 24px;">COURSE REGISTRATION FORM
</strong> - <span style="color: #00F"><strong><em>Click Here to Return to other pages</em></strong></span></p>
<p align="center" style="text-align: left; font-size: 16px;">
<label for="LastName">LAST NAME:</label>
<input name="LastName" type="text" id="LastName" form="form2" size="40">
<label for="Firstname">FIRST NAME:</label>
<input name="Firstname" type="text" id="Firstname" form="form2" size="40">
</p>
<p>
<label for="Occupation">OCCUPATION:</label>
<input name="Occupation" type="text" id="Occupation" form="form2" size="100" maxlength="40">
</p>
<p>
<label for="Organisation">ORGANISATION:</label>
<input name="Organisation" type="text" id="Organisation" form="form2" size="97">
</p>
<p>
<label for="Address">ADDRESS:</label>
<input name="Address" type="text" id="Address" form="form2" size="105">
</p>
<p>
<label for="email:">EMAIL:</label>
<input name="email:" type="email" id="email:" form="form2" size="109">
</p>
<p>
<label for="Telephone">TELEPHONE:</label>
<input name="Telephone" type="tel" id="Telephone" form="form2" size="102">
</p>
<u><p><strong>PAYMENT MODE</strong></p></u>
<u><p><strong><span style="color: #F00">Bank Account Details </span></strong></p></u>
<p><strong><span style="color: #F00">Bank - Zenith Bank Nig Plc.</span></strong></p>
<p><strong><span style="color: #F00">Account Name:- Lead Vision Concepts</span></strong></p>
<p><strong><span style="color: #F00">Account Number:- </span></strong></p>
<table width="200">
<tr>
<td><label>
<input name="Bank" type="radio" id="PaymentType_0" form="form2" value="radio">
BANK (ZENITH)</label></td>
</tr>
<tr>
<td><label>
<input name="Direct_Payment" type="radio" id="PaymentType_1" form="form2" value="radio">
DIRECT (CASH)
</label></td>
</tr>
</table>
<p>
<label for="Teller No.">TELLER NO:</label>
<input name="Teller No." type="text" id="Teller No." form="form2" size="40">
<label for="Amount Paid">AMOUNT PAID:</label>
<input name="Amount Paid" type="text" id="Amount Paid" form="form2" autocomplete="on" size="40">
</p>
<p>
<input name="submit" type="submit" id="submit" form ="form2" value="Submit">
<input type="reset" name="reset" id="reset" value="Reset">
</p>
</form>
Use this PHP code on sendresult.php
<?php
foreach($_POST as $key=>$value){
echo "{$key}: {$value}<br />";
}
?>
Related
I want to have four separate forms right under one another. However, when I enter the code below I get four nested forms. The first form nests the next three forms. The following form nests the next two forms, etc...
<form name="my form" method="get">
<div id="contactInfo">
<p><fieldset><legend><strong>Contact Info</legend></strong></p>
<label>Name</label><input type="text" name="FullName" style="width: 300px;" value="First and last name" /> <br>
<label>Street Address</label><input type="text" name="Address" style="width: 300px;"/> <br>
<label>Zip Code</label><input type="text" name="ZipCode" /> <br>
<label>Email</label><input type="text" name="EmailAddress"style="width: 300px;" value="address#example.com" /> <br>
<label>Phone</label><input type="text" name="PhoneNumber" />
<p><fieldset><legend><strong>Best day(s) to schedule a visit</strong></legend></p>
<input type="checkbox" name="date" id="date1" value="Mon" /> Monday
<input type="checkbox" name="date" id="date2" value="Tues" /> Tuesday
<input type="checkbox" name="date" id="date3" value="Wed" /> Wednesday
<input type="checkbox" name="date" id="date4" value="Thur" /> Thursday
<input type="checkbox" name="date" id="date5" value="Fri" /> Friday
<input type="checkbox" name="date" id="date6" value="Sat" /> Saturday
<input type="checkbox" name="date" id="date7" value="Sun" /> Sunday
<p><fieldset><legend><strong>Project Area</strong></legend></p>
<input type="radio" name="choice" id="choice1" value="frontOfHouse" /> Front of House <br>
<input type="radio" name="choice" id="choice2" value="Border" /> Border of Property <br>
<input type="radio" name="choice" id="choice3" value="multipleAreas" /> Multiple Areas (please specify in Notes box below) <br>
<input type="radio" name="choice" id="choice4" value="Other" /> Other (please specify in Notes box below) <br>
<p><fieldset><legend><strong>Additional Information</strong></legend></p>
Notes <br>
<textarea name="comments" align="left" rows="5" cols="50"></textarea>
<p></fieldset></p>
<input type="submit" value="Submit Request"/>
You've got one </fieldset> tag, but four <fieldset> tags. Make sure to close each one up, and you'll avoid the nesting issue!
Edit:
A nesting issue shown in CodePen: http://codepen.io/cam5/pen/vXdGQz
That pen, forked, with closing tags: http://codepen.io/cam5/pen/QKQNzw
Get the Fiddle. https://jsfiddle.net/7p0g2hq9/
Be attentive with the tags.
<form name="my form" method="get">
<div id="contactInfo">
<fieldset><p><legend>
<strong>Contact Info</strong></legend>
</p>
<label>Name</label><input type="text" name="FullName" style="width: 300px;" value="First and last name" /> <br>
<label>Street Address</label><input type="text" name="Address" style="width: 300px;"/> <br>
<label>Zip Code</label><input type="text" name="ZipCode" /> <br>
<label>Email</label><input type="text" name="EmailAddress"style="width: 300px;" value="address#example.com" /> <br>
<label>Phone</label><input type="text" name="PhoneNumber" />
</fieldset>
<fieldset><p><legend><strong>Best day(s) to schedule a visit</strong></legend></p>
<input type="checkbox" name="date" id="date1" value="Mon" /> Monday
<input type="checkbox" name="date" id="date2" value="Tues" /> Tuesday
<input type="checkbox" name="date" id="date3" value="Wed" /> Wednesday
<input type="checkbox" name="date" id="date4" value="Thur" /> Thursday
<input type="checkbox" name="date" id="date5" value="Fri" /> Friday
<input type="checkbox" name="date" id="date6" value="Sat" /> Saturday
<input type="checkbox" name="date" id="date7" value="Sun" /> Sunday
</fieldset>
<fieldset><p><legend><strong>Project Area</strong></legend></p>
<input type="radio" name="choice" id="choice1" value="frontOfHouse" /> Front of House <br>
<input type="radio" name="choice" id="choice2" value="Border" /> Border of Property <br>
<input type="radio" name="choice" id="choice3" value="multipleAreas" /> Multiple Areas (please specify in Notes box below) <br>
<input type="radio" name="choice" id="choice4" value="Other" /> Other (please specify in Notes box below) <br>
</fieldset>
<fieldset><p><legend><strong>Additional Information</strong></legend></p>
Notes <br>
<textarea name="comments" align="left" rows="5" cols="50"></textarea>
</fieldset>
<input type="submit" value="Submit Request"/>
If I helped, don't forget to mark as correct
The email form I'm trying to fix gives me an error saying:
This can not be accessed this way, you need to have an input field named 'sendtoemail'
Which is strange because i have that input field. Here's the code:
<h2>Contact AirKrete</h2>
<form action="http://www.hostmonster.com/monstermail" enctype="multipart/form-data" method="post"><p><label><input type="checkbox" name="locate " id="locate "><strong>Locate an Installer</strong></label><strong><label><input type="checkbox" name="become" id="become">Become an Installer</label></strong></p>
<div class="left">Name:<div>
<input name="name" type="text" id="name" onDblClick="MM_validateForm('name','','R');return document.MM_returnValue" size="40" />
</div></div>
<div class="left">Email:<div><input name="mailfrom" type="text" onDblClick="MM_validateForm('email','','NisEmail');return document.MM_returnValue" size="40" /></div></div>
<div class="left">Street:<div><input name="street" type="text" id="street" onDbleClick="MM_validateForm('street','','R');return document.MM_returnValue" size="40" /></div></div>
<div class="left">City:<div><input name="city" type="text" id="city" onDbleClick="MM_validateForm('city','','R');return document.MM_returnValue" size="40" /></div></div>
<div class="left">State:<div><input name="state" type="text" id="state" onDblClick="MM_validateForm('state','','R');return document.MM_returnValue" size="10" /> Zip:
<input name="zip" type="text" id="zip" onDblClick="MM_validateForm('zip','','R');return document.MM_returnValue" size="15" />
</div></div>
<div class="left">Country:<div><input name="country" type="text" id="country" onDblClick="MM_validateForm('country','','R');return document.MM_returnValue" size="40" /></div></div>
<div class="left">Phone:<div><input name="phone" type="text" id="phone" onDblClick="MM_validateForm('phone','','R');return document.MM_returnValue" size="40" /></div></div></p>
<p>The fields above are REQUIRED<br>
<strong>How did you hear about AirKrete<span style="font-size:11.0pt; ">®</span>? <br>
Please make a selection.<span id="sprycheckbox1"><span class="checkboxRequiredMsg"></span></span></strong></p><div class="radiox"><label><input type="radio" name="Connection" value="friend" id="Connection_0">Friend</label></div>
<div class="radiox"><label><input type="radio" name="Connection" value="jobspec" id="Connection_1">Job Specification</label></div>
<div class="radiox"><label><input type="radio" name="Connection" value="hgtv" id="Connection_2">HGTV Promotion</label></div>
<div class="radiox"><label><input type="radio" name="Connection" value="web" id="Connection_3">Web Browsing</label></div>
<div class="radiox"><label><input type="radio" name="Connection" value="radio" id="Connection_4">Radio</label></div>
<div class="radiox"><label><input type="radio" name="Connection" value="tv" id="Connection_5">TV</label></div>
<div class="radiox"><label><input type="radio" name="Connection" value="other" id="Connection_6">Other</label></div></p>
<p class="clear-fix"> </p>
<div><p><strong>Comments:</strong><br></p></div>
<p><textarea name="Comments" cols="43" rows="10" id="Comments"></textarea></p>
<p><label>If you have Attachments....</label></p>
<p><input name="file_attachment" type="file" size="30" /></p>
<p>When completed please click Send Email Button</p>
<input name="sendtoemail" type="hidden" id="sendtoemail" value="info#airkrete.com" />
<input type="submit" onClick="MM_validateForm('name','','R','zip','','R','phone','','R');return document.MM_returnValue" value="Send Email" />
<input type="hidden" name="redirect" value="http://www.airkrete.com/airkrete_thankyou.php" /><p>Thank You</p>
</form>
If you know what I'm doing wrong here, some advice would be greatly appreciated. Thank you.
I opened a live chat and talked to a representative about it. It turns out they discontinued this service but did not take it off the options they used. Thanks for the help everyone.
BlueMail prohibits sending a form to an email address that is not hosted on this same bluehost account. the solution is to setup a mail forwarder in the account which can then send "forward" off site. Then simply send the form to the address that is forwarded.
So I'm trying to make a form with a message box, but it won't align correctly; it keeps pushing the text to the bottom of the area it takes up..
I've accepted putting in a break between the text field and the message field for a long time, but there's a break, so it isn't aligned there either...
JSFiddle: http://jsfiddle.net/2U2PJ/
<form action="sending.php" method="post" name="Contact Form" id="form1" onsubmit="MM_validateForm('Name','','R','E-mail','','R','Device','','R','Message','','R')return document.MM_returnValue" encytype="text/plain">
<p>
<label><font size="3">Name: </font>
<input name="Name" type="text" id="Name" size="25" /><font size="2"> <font color="red"><span id="req_3" class="req">*</span></font></font></label>
</p>
<p>
<label><font size="3">Email:</font>
<input name="E-mail" type="text" id="E-mail" size="25" /> <font size="2"><font color="red"><span id="req_3" class="req">*</span></font></font></label>
</p>
<p>
<label><font size="3">Review:</font>
<textarea name="Message" cols="35" rows="7" id="Message" placeholder="Y U SO BROKE MR. THINGY D;"></textarea>
</p>
</label>
<label>
<input name="Submit" type="submit" id="Submit" value="Submit" />
</label>
</form>
As per my comment. Use CSS. This should get you on the correct path:
http://jsfiddle.net/2U2PJ/3/
css:
.contact-form .field label { width: 100px; display:inline-block; vertical-align: top; }
.contact-form .req { color: red; }
.contact-form .field .textbox { width: 180px; }
html:
<div class="contact-form">
<form action="sending.php" method="post" name="Contact Form" id="form1" onsubmit="MM_validateForm('Name','','R','Email','','R','Device','','R','Message','','R')return document.MM_returnValue" encytype="text/plain">
<div class="field">
<label for="Name">Name:</label>
<input name="Name" type="text" id="Name" class="textbox" />
<span id="req_3" class="req">*</span>
</div>
<div class="field">
<label for="Email">Email:</label>
<input name="Email" type="text" id="Email" class="textbox" />
<span id="req_3" class="req">*</span>
</div>
<div class="field">
<label for="Message">Review:</label>
<textarea name="Message" cols="35" rows="7" id="Message" placeholder="Y U SO BROKE MR. THINGY D;"></textarea>
</div>
<div>
<input name="Submit" type="submit" id="Submit" value="Submit" />
</div>
</form>
</div>
Full Code to simplify your issue!
http://jsfiddle.net/SinisterSystems/jLXsV/2/
HTML:
<form action="sending.php" method="post" name="Contact Form" id="form1" onsubmit="MM_validateForm('Name','','R','E-mail','','R','Device','','R','Message','','R')return document.MM_returnValue" encytype="text/plain">
<p>
<label>Name:</label>
<input type="text" />
</p>
<p>
<label>Email:</label>
<input type="text" />
</p>
<p>
<label>Review:</label>
<textarea rows="7" cols="35"></textarea>
</p>
<p>
<input name="Submit" type="submit" id="Submit" value="Submit" />
</p>
CSS:
input, textarea {
width:200px;
margin-left:15px;
}
label {
float:left;
min-width:100px;
}
With your IDs
Fiddle: http://jsfiddle.net/SinisterSystems/jLXsV/3/
I am using Cimy User Extra Fields plugin for extra fields in Wordpress registration but I would like to make it in two columns so users would not scroll since now I have to many fields. I have problem in how to implement it in code. When I am editing via Inspect element it looks like this
<form name="registerform" id="registerform" action="http://test.com/wp-login.php?action=register" method="post" style="
position: absolute;
margin-left: -200px;
">
<div style="float:left;width: 350px;" ;=""><p>
<label for="user_login">Username<br>
<input type="text" name="user_login" id="user_login" class="input" value="" size="20"></label>
</p>
<p>
<label for="user_email">E-mail<br>
<input type="text" name="user_email" id="user_email" class="input" value="" size="25"></label>
</p>
<!--
Start code from Cimy User Extra Fields 2.5.1
Copyright (c) 2006-2013 Marco Cimmino
http://www.marcocimmino.net/cimy-wordpress-plugins/cimy-user-extra-fields/
-->
<input type="hidden" name="cimy_post" value="1">
<p id="cimy_uef_wp_p_field_1">
<label for="cimy_uef_wp_1">Password</label><input type="password" name="cimy_uef_wp_PASSWORD" id="cimy_uef_wp_1" class="cimy_uef_input_27" value="" maxlength="100">
</p>
<p id="cimy_uef_wp_p_field_2">
<label for="cimy_uef_wp_2">Password confirmation</label><input type="password" name="cimy_uef_wp_PASSWORD2" id="cimy_uef_wp_2" class="cimy_uef_input_27" value="" maxlength="100">
</p></div>
<div style="float:right;width: 350px;padding-left: 30px;" ;="">
<p id="cimy_uef_wp_p_field_3">
<label for="cimy_uef_wp_3">First name</label><input type="text" name="cimy_uef_wp_FIRSTNAME" id="cimy_uef_wp_3" class="cimy_uef_input_27" value="" maxlength="100">
</p>
<p id="cimy_uef_wp_p_field_4">
<label for="cimy_uef_wp_4">Last name</label><input type="text" name="cimy_uef_wp_LASTNAME" id="cimy_uef_wp_4" class="cimy_uef_input_27" value="" maxlength="100">
</p>
<p id="cimy_uef_p_field_1">
<label for="cimy_uef_1">Company</label><input type="text" name="cimy_uef_COMPANY" id="cimy_uef_1" class="cimy_uef_input_27" value="" maxlength="100">
</p>
<p id="cimy_uef_p_field_2">
<label for="cimy_uef_2">Industry </label><select name="cimy_uef_INDUSTRY" id="cimy_uef_2" class="cimy_uef_input_27">
<option value="Consulting">Consulting</option>
<option value="Events and PR">Events and PR</option>
<option value="Other industries">Other industries</option></select>
</p>
<br>
<!--
End of code from Cimy User Extra Fields
-->
</div>
<p id="reg_passmail">A password will be e-mailed to you.</p>
<br class="clear">
<input type="hidden" name="redirect_to" value="">
<p class="submit"><input type="submit" name="wp-submit" id="wp-submit" class="button button-primary button-large" value="Register"></p>
</form>
NOTE: I would like first div to open before user_login to close after cimy_uef_wp_p_field_2
Is there any way to make something like this since user_login is default wp-login.php field and cimy_uef_wp_p_field_2 is Cimy User Extra Fields plugin field
For some reason the focus keeps getting shifted from any of the address field to the credit card field on my HTML form.
So onclick of address fields, the focus goes back to the credit card field.
It's probably something really simple, but can anyone help?
http://jsfiddle.net/xYbsz/
<form name='order-validation'>
<p><label>email: <input type="email" title="email" id="emailAddress" name="email" value=""></label></p>
<p>
Phone: <select name="countrycode" style="display: inline;">
<option value="44" selected>UK (+44)</option>
<option value="1">USA (+1)</option>
<option value="213">Algeria (+213)</option>
</select><input type="tel" name="phone" id="id_tel" required pattern="(\+?\d[-.]*){7,13}" title="international, national or local phone number"/></p>
<img class="cc-img" id="visa-card-img" src="visa.jpg" />
<img class="cc-img" id="mastercard-card-img" src="mastercard.jpg" />
<img class="cc-img" id="amex-card-img"src="american-express.jpg" />
<p><label>credit card: <input type="text" id="cc_number" pattern="[0-9]{13,16}"><br />
<img class="cc-security-code" id="visa-sec-code" src="cvv.gif" />
<img class="cc-security-code" id="amex-sec-code" style="display: none;" src="amex-sec-code.gif" /><br />
Address:
<input type="text" name="newCreditCardStreet" size="35" tabindex="5" value="" id="id_creditCardStreet"><br />
Town/City:
<input type="text" name="newCreditCardLocality" size="35" tabindex="5" value="" id="id_creditCardLocality"><br />
Country:
<input type="text" name="country" id="id_country">
<p><input type="button" name="submit" value="Submit" /></p>
<p id="test"></p>
</form>
The label tag for cc_number is not closed.
<label for="cc_number">credit card:</label>
<input type="text" id="cc_number" pattern="[0-9]{13,16}"><br />
Also I noticed in the markup the label tags are wrapping the inputs. This is unnecessary:
<label>email:
<input type="email" title="email" id="emailAddress" name="email" value="">
</label>
Instead use the for attribute:
<label for="emailAddress">email:</label>
<input type="email" title="email" id="emailAddress" name="email" value="">
Working Example http://jsfiddle.net/xYbsz/1/