Paypal Drop-Down Menu Rendering Individually - forms

my paypal drop-down button is not showing up as a drop down, rather it is showing up as individual boxes.
you can see here:http://www.mattemig.net/store/
code below
<form action="https://www.paypal.com/cgi-bin/webscr" method="post"><input type="hidden" name="cmd" value="_s-xclick" /> <input type="hidden" name="hosted_button_id" value="FUT8A68TBGR9Y" />
<table>
<tbody>
<tr>
<td><input type="hidden" name="on0" value="Size" />Size</td>
</tr>
<tr>
<td><select name="os0"> <option value="3 Link (11")">3 Link (11") </option> </select> <select name="os0"> <option value="4 Link (11")">4 Link (11") </option> </select> <select name="os0"> <option value="3 Link (9")">3 Link (9")</option> </select></td>
</tr>
<tr>
<td><input type="hidden" name="on1" value="Base Color" />Base Color</td>
</tr>
<tr>
<td><select name="os1"> <option value="Hot Pink">Hot Pink </option> </select> <select name="os1"> <option value="Ruby Red">Ruby Red </option> </select> <select name="os1"> <option value="Tangerine">Tangerine </option> </select> <select name="os1"> <option value="Emerald Green">Emerald Green </option> </select> <select name="os1"> <option value="Blue Royal">Blue Royal </option> </select> <select name="os1"> <option value="Pure Purple">Pure Purple </option> </select> <select name="os1"> <option value="Midnight Black">Midnight Black </option> </select></td>
</tr>
</tbody>
</table>
<input type="image" name="submit" src="https://www.paypalobjects.com/WEBSCR-640-20110429-1/en_US/i/btn/btn_cart_LG.gif" alt="PayPal - The safer, easier way to pay online!" /> <img src="https://www.paypalobjects.com/WEBSCR-640-20110429-1/en_US/i/scr/pixel.gif" alt="" width="1" height="1" border="0" /></form>

All your select options are appearing in their own select. Change this to a single <select> instead.
E.g., for the 'Size', from:
<td><input type="hidden" name="on0" value="Size" />Size</td>
</tr>
<tr>
<td><select name="os0"> <option value="3 Link (11")">3 Link (11") </option> </select> <select name="os0"> <option value="4 Link (11")">4 Link (11") </option> </select> <select name="os0"> <option value="3 Link (9")">3 Link (9")</option> </select></td>
To:
<td><input type="hidden" name="on0" value="Size" />Size</td>
</tr>
<tr>
<td>
<select name="os0">
<option value="3 Link (11")">3 Link (11") </option>
<option value="4 Link (11")">4 Link (11") </option>
<option value="3 Link (9")">3 Link (9")</option>
</select></td>

Related

Where does a customer enter coupon code 2checkout?

I want to add coupons on my live site but before I do that I am testing the coupons on my sandbox. I have created coupons in the 2checkout admin area. According to the documentation, a customer enters the coupon code after being redirected to the 2checkout site. However, I only see the pop up but i don't see any area to enter coupon code.What gives?
<form class="form-horizontal form" action="<?php echo $action;?>" method="post">
<div class="panel panel-primary">
<div class="panel-heading"><strong>BILLING INFORMATION</strong></div>
<div class="panel-body">
<div class="form-group required">
<label class="col-md-2">Country</label>
<div class="col-md-10">
<select id="country" class="form-control" name="country" autocomplete="on" required="">
<option value="" class="ng-binding">- Choose Country -</option>
<option value="USA">United States</option>
<option value="GBR">United Kingdom</option>
<option value="CAN">Canada</option>
<option value="AUS">Australia</option>
<option disabled="" value="—">—</option>
<option value="ALA">Åland Islands</option>
<option value="AFG">Afghanistan</option>
<option value="ALB">Albania</option>
<option value="DZA">Algeria</option>
<option value="ASM">American Samoa</option>
<option value="AND">Andorra</option>
<option value="AGO">Angola</option>
<option value="AIA">Anguilla</option>
<option value="ATA">Antarctica</option>
<option value="ATG">Antigua and Barbuda</option>
<option value="ARG">Argentina</option>
<option value="ARM">Armenia</option>
<option value="ABW">Aruba</option>
<option value="AUS">Australia</option>
<option value="AUT">Austria</option>
<option value="AZE">Azerbaijan</option>
<option value="BHS">Bahamas</option>
<option value="BHR">Bahrain</option>
<option value="BGD">Bangladesh</option>
<option value="BRB">Barbados</option>
<option value="BLR">Belarus</option>
<option value="BEL">Belgium</option>
<option value="BLZ">Belize</option>
<option value="BEN">Benin</option>
<option value="BMU">Bermuda</option>
<option value="BTN">Bhutan</option>
<option value="BOL">Bolivia</option>
<option value="BES">Bonaire, Sint Eustatius and Saba</option>
<option value="BIH">Bosnia and Herzegovina</option>
<option value="BWA">Botswana</option>
<option value="BVT">Bouvet Island</option>
<option value="BRA">Brazil</option>
<option value="IOT">British Indian Ocean Territory</option>
<option value="BRN">Brunei Darussalam</option>
<option value="BGR">Bulgaria</option>
<option value="BFA">Burkina Faso</option>
<option value="BDI">Burundi</option>
<option value="KHM">Cambodia</option>
<option value="CMR">Cameroon</option>
<option value="CAN">Canada</option>
<option value="CPV">Cape Verde</option>
<option value="CYM">Cayman Islands</option>
<option value="CAF">Central African Republic</option>
<option value="TCD">Chad</option>
<option value="CHL">Chile</option>
<option value="CHN">China</option>
<option value="CXR">Christmas Island</option>
<option value="CCK">Cocos (Keeling) Islands</option>
<option value="COL">Colombia</option>
<option value="COM">Comoros</option>
<option value="COG">Congo</option>
<option value="COD">Congo, the Democratic Republic of the</option>
<option value="COK">Cook Islands</option>
<option value="CRI">Costa Rica</option>
<option value="CIV">Cote D'ivoire</option>
<option value="HRV">Croatia (Hrvatska)</option>
<option value="CYP">Cyprus</option>
<option value="CZE">Czech Republic</option>
<option value="DNK">Denmark</option>
<option value="DJI">Djibouti</option>
<option value="DMA">Dominica</option>
<option value="DOM">Dominican Republic</option>
<option value="ECU">Ecuador</option>
<option value="EGY">Egypt</option>
<option value="SLV">El Salvador</option>
<option value="GNQ">Equatorial Guinea</option>
<option value="ERI">Eritrea</option>
<option value="EST">Estonia</option>
<option value="ETH">Ethiopia</option>
<option value="FLK">Falkland Islands (Malvinas)</option>
<option value="FRO">Faroe Islands</option>
<option value="FJI">Fiji</option>
<option value="FIN">Finland</option>
<option value="FRA">France</option>
<option value="FXX">France, Metropolitan</option>
<option value="GUF">French Guiana</option>
<option value="PYF">French Polynesia</option>
<option value="ATF">French Southern Territories</option>
<option value="GAB">Gabon</option>
<option value="GMB">Gambia</option>
<option value="GEO">Georgia</option>
<option value="DEU">Germany</option>
<option value="GHA">Ghana</option>
<option value="GIB">Gibraltar</option>
<option value="GRC">Greece</option>
<option value="GRL">Greenland</option>
<option value="GRD">Grenada</option>
<option value="GLP">Guadeloupe</option>
<option value="GUM">Guam</option>
<option value="GTM">Guatemala</option>
<option value="GGY">Guernsey</option>
<option value="GIN">Guinea</option>
<option value="GNB">Guinea-Bissau</option>
<option value="GUY">Guyana</option>
<option value="HTI">Haiti</option>
<option value="HMD">Heard Island and Mcdonald Islands</option>
<option value="HND">Honduras</option>
<option value="HKG">Hong Kong</option>
<option value="HUN">Hungary</option>
<option value="ISL">Iceland</option>
<option value="IND">India</option>
<option value="IDN">Indonesia</option>
<option value="IRQ">Iraq</option>
<option value="IRL">Ireland</option>
<option value="IMN">Isle of Man</option>
<option value="ISR">Israel</option>
<option value="ITA">Italy</option>
<option value="JAM">Jamaica</option>
<option value="JPN">Japan</option>
<option value="JEY">Jersey</option>
<option value="JOR">Jordan</option>
<option value="KAZ">Kazakhstan</option>
<option value="KEN">Kenya</option>
<option value="KIR">Kiribati</option>
<option value="KOR">Korea, Republic of</option>
<option value="UNK">UNK</option>
<option value="KWT">Kuwait</option>
<option value="KGZ">Kyrgyzstan</option>
<option value="LAO">Lao People's Democratic Republic</option>
<option value="LVA">Latvia</option>
<option value="LBN">Lebanon</option>
<option value="LSO">Lesotho</option>
<option value="LBR">Liberia</option>
<option value="LBY">Libyan Arab Jamahiriya</option>
<option value="LIE">Liechtenstein</option>
<option value="LTU">Lithuania</option>
<option value="LUX">Luxembourg</option>
<option value="MAC">Macao</option>
<option value="MKD">Macedonia</option>
<option value="MDG">Madagascar</option>
<option value="MWI">Malawi</option>
<option value="MYS">Malaysia</option>
<option value="MDV">Maldives</option>
<option value="MLI">Mali</option>
<option value="MLT">Malta</option>
<option value="MHL">Marshall Islands</option>
<option value="MTQ">Martinique</option>
<option value="MRT">Mauritania</option>
<option value="MUS">Mauritius</option>
<option value="MYT">Mayotte</option>
<option value="MEX">Mexico</option>
<option value="FSM">Micronesia, Federated States of</option>
<option value="MDA">Moldova, Republic of</option>
<option value="MCO">Monaco</option>
<option value="MNG">Mongolia</option>
<option value="MNE">Montenegro</option>
<option value="MSR">Montserrat</option>
<option value="MAR">Morocco</option>
<option value="MOZ">Mozambique</option>
<option value="MMR">Myanmar</option>
<option value="NAM">Namibia</option>
<option value="NRU">Nauru</option>
<option value="NPL">Nepal</option>
<option value="NLD">Netherlands</option>
<option value="ANT">Netherlands Antilles</option>
<option value="NCL">New Caledonia</option>
<option value="NZL">New Zealand</option>
<option value="NIC">Nicaragua</option>
<option value="NER">Niger</option>
<option value="NGA">Nigeria</option>
<option value="NIU">Niue</option>
<option value="NFK">Norfolk Island</option>
<option value="MNP">Northern Mariana Islands</option>
<option value="NOR">Norway</option>
<option value="OMN">Oman</option>
<option value="PAK">Pakistan</option>
<option value="PLW">Palau</option>
<option value="PSE">Palestinian Territory, Occupied</option>
<option value="PAN">Panama</option>
<option value="PNG">Papua New Guinea</option>
<option value="PRY">Paraguay</option>
<option value="PER">Peru</option>
<option value="PHL">Philippines</option>
<option value="PCN">Pitcairn</option>
<option value="POL">Poland</option>
<option value="PRT">Portugal</option>
<option value="PRI">Puerto Rico</option>
<option value="QAT">Qatar</option>
<option value="REU">Reunion</option>
<option value="ROU">Romania</option>
<option value="RUS">Russian Federation</option>
<option value="RWA">Rwanda</option>
<option value="SHN">Saint Helena</option>
<option value="KNA">Saint Kitts and Nevis</option>
<option value="LCA">Saint Lucia</option>
<option value="SPM">Saint Pierre and Miquelon</option>
<option value="VCT">Saint Vincent and the Grenadines</option>
<option value="WSM">Samoa</option>
<option value="SMR">San Marino</option>
<option value="STP">Sao Tome and Principe</option>
<option value="SAU">Saudi Arabia</option>
<option value="SEN">Senegal</option>
<option value="SRB">Serbia</option>
<option value="SCG">Serbia and Montenegro</option>
<option value="SYC">Seychelles</option>
<option value="SLE">Sierra Leone</option>
<option value="SGP">Singapore</option>
<option value="SVK">Slovakia</option>
<option value="SVN">Slovenia</option>
<option value="SLB">Solomon Islands</option>
<option value="SOM">Somalia</option>
<option value="ZAF">South Africa</option>
<option value="SGS">South Georgia and the South Sandwich Islands</option>
<option value="ESP">Spain</option>
<option value="LKA">Sri Lanka</option>
<option value="SUR">Suriname</option>
<option value="SJM">Svalbard and Jan Mayen Islands</option>
<option value="SWZ">Swaziland</option>
<option value="SWE">Sweden</option>
<option value="CHE">Switzerland</option>
<option value="TWN">Taiwan</option>
<option value="TJK">Tajikistan</option>
<option value="TZA">Tanzania, United Republic of</option>
<option value="THA">Thailand</option>
<option value="TLS">Timor-Leste</option>
<option value="TGO">Togo</option>
<option value="TKL">Tokelau</option>
<option value="TON">Tonga</option>
<option value="TTO">Trinidad and Tobago</option>
<option value="TUN">Tunisia</option>
<option value="TUR">Turkey</option>
<option value="TKM">Turkmenistan</option>
<option value="TCA">Turks and Caicos Islands</option>
<option value="TUV">Tuvalu</option>
<option value="UGA">Uganda</option>
<option value="UKR">Ukraine</option>
<option value="ARE">United Arab Emirates</option>
<option value="GBR">United Kingdom</option>
<option value="USA">United States</option>
<option value="UMI">United States Minor Outlying Islands</option>
<option value="URY">Uruguay</option>
<option value="UZB">Uzbekistan</option>
<option value="VUT">Vanuatu</option>
<option value="VAT">Vatican City State (Holy See)</option>
<option value="VEN">Venezuela</option>
<option value="VNM">Viet Nam</option>
<option value="VGB">Virgin Islands, British</option>
<option value="VIR">Virgin Islands, U.S.</option>
<option value="WLF">Wallis and Futuna Islands</option>
<option value="ESH">Western Sahara</option>
<option value="YEM">Yemen</option>
<option value="YUG">Yugoslavia</option>
<option value="ZAR">Zaire</option>
<option value="ZMB">Zambia</option>
<option value="ZWE">Zimbabwe</option>
</select>
</div>
</div>
<div class="form-group required">
<label class="col-md-2">Full Name</label>
<div class="col-md-10">
<input class="form-control" id="card_holder_name" name="card_holder_name" type="text" placeholder="Full Name" required />
</div>
</div>
<div class="form-group required">
<label class="col-md-2">Address 1</label>
<div class="col-md-10">
<input class="form-control" id="street_address" name="street_address" type="text" placeholder="Address 1" required />
</div>
</div>
<div class="form-group">
<label class="col-md-2">Address 2</label>
<div class="col-md-10">
<input class="form-control" id="street_address2" name="street_address2" type="text" placeholder="Address 2"/>
</div>
</div>
<div class="form-group required">
<label class="col-md-2">City</label>
<div class="col-md-10">
<input class="form-control" id="city" name="city" type="text" placeholder="City" required />
</div>
</div>
<div class="form-group required">
<label class="col-md-2">State / Province</label>
<div class="col-md-10">
<input class="form-control" id="state" name="state" type="text" placeholder="State/Province" required />
</div>
</div>
<div class="form-group required">
<label class="col-md-2">Postal Code</label>
<div class="col-md-10">
<input class="form-control" id="zip" name="zip" type="text" placeholder="Postal Code" required />
</div>
</div>
<div class="form-group">
<label class="col-md-2">Phone</label>
<div class="col-md-10">
<input class="form-control" id="phone" name="phone" type="text" placeholder="Phone" required />
</div>
</div><!--form group-->
<div class="form-group required">
<label class="col-md-2">Email</label>
<div class="col-md-10">
<input class="form-control" id="email" name="email" type="text" placeholder="Email" required />
</div>
</div>
<input type='hidden' name='sid' value='<?php echo TWOCHECKOUT_SELLER_ID;?>' />
<input type='hidden' name='mode' value='2CO' />
<input type='hidden' name='li_0_type' value='product' />
<input type='hidden' name='li_0_name' value='<?php echo $product_name;?>' />
<input type='hidden' name='li_0_product_id' value='<?php echo $order_id;?>' />
<input type='hidden' name='li_0_price' value='<?php echo $total;?>' />
</div>
</div>
<div class="col-md-12 text-center">
<input type="submit" class="btn btn-success btn-sm" value="Complete Checkout">
</div>
</form>
Consider using standard checkout instead. It lets the customer add the coupon code in the review cart step

unable to pass the drop down values to Paypal

Here is a little html that is supposed to send product information (number of units, size and color of two products) out to Paypal. The units, and size get through to Paypal, but for some reason the drop down menus with the color do not. Can anybody see an error in my code?
<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> Order Test Product</title>
<meta name="verify-v1" content="n3Dpx4NklZjg5p/Tq7h1q+Oj6Ml83crtkO/PwepVQ6Y=" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name= "robots" content="index,nofollow" />
</head>
<body>
<h1> Order your footwear here </h1>
<h2> Select your size, colour and quantity desired, then click PAY NOW </h2>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<table width="80%" border="1" align="center">
<tr><th>Product</th><th>Color</th><th>Quantity</th><th width="90">Not Ordeed</th><th>Size Small</th><th>Size Medium</th><th>Size Large</th></tr>
<tr><th> Shoes</th>
<td> <input type="hidden" name="on1" value="color" />
<select name="os1">
<option value="---">Select Color </option>
<option value="brown-shoes">Brown </option>
<option value="black-shoes">Black </option>
<option value="White-shoes">White </option>
</select></td>
<td><input type="text" size="2" maxlength="3" name="quantity_1" /></td>
<td><label>
<input type="radio" name="amount_1" value="0" checked="checked" /></label></td>
<td title="€7"><label>
<input type="radio" name="amount_1" value="7" />
</label></td>
<td title="€10"><label>
<input type="radio" name="amount_1" value="10" /></label></td>
<td title="€13"><label>
<input type="radio" name="amount_1" value="13" /></label></td>
</tr>
<tr>
<th>Boots</th>
<td><input type="hidden" name="on2" value="color" />
<select name="os2">
<option value="---">Select Color </option>
<option value="brown-boots">Brown </option>
<option value="black-boots">Black </option>
<option value="White-boots">White </option>
</select></td>
<td><input type="text" size="2" maxlength="3" name="quantity_2" /><br /></td>
<td><label>
<input type="radio" name="amount_2" value="0" checked="checked" />
</label><br /><br /></td>
<td title="€15"><label>
<input type="radio" name="amount_2" value="15" />
</label></td>
<td title="€20"><label>
<input type="radio" name="amount_2" value="20" />
</label></td>
<td title="€25"><label>
<input type="radio" name="amount_2" value="25" />
</label></td>
</tr>
</table>
<br /><br />
<input type="image" src="../eStore/paynow.jpg" name="submit" alt="PayPal - The safer, easier way to pay online." />
<img alt="" border="0" src="https://www.paypal.com/en_GB/i/scr/pixel.gif" width="1" height="1" />
<input type="hidden" name="cmd" value="_cart" />
<input type="hidden" name="upload" value="1" />
<input type="hidden" name="business" value="info#kalikalos.com" />
<input type="hidden" name="currency_code" value="EUR" />
<input type="hidden" name="item_name_1" value="Shoes" />
<input type="hidden" name="item_name_2" value="Boots" />
</form>
</body>
</html>
Refer to Paypal not picking up selection choices, you need to change the code:
<tr><th> Shoes</th>
<td> <input type="hidden" name="on0_1" value="color" />
<select name="os0_1">
<option value="---">Select Color </option>
<option value="brown-shoes">Brown </option>
<option value="black-shoes">Black </option>
<option value="White-shoes">White </option>
</select></td>
.....
<tr>
<th>Boots</th>
<td><input type="hidden" name="on0_2" value="color" />
<select name="os0_2">
<option value="---">Select Color </option>
<option value="brown-boots">Brown </option>
<option value="black-boots">Black </option>
<option value="White-boots">White </option>
</select></td>

Input alignment issues with labels

I am trying to align this forms inputs. They are all the same size, the problem is that the labels are forcing the inputs to push to the right. I am trying to get it to look like this:
http://imgur.com/1J958bb
But it looks like this:
.formWrapper
{
display: block;
width: 1000px;
margin: 0 auto;
}
.personalInformation
{
width: 480px;
display: inline-block;
}
.submissionInformation
{
width: 480px;
display: inline-block;
vertical-align: top;
}
.col-center ul, li
{
list-style-type: none;
}
.col-center hr
{
border-bottom: 1px solid #000;
}
.col-center input, select
{
border-color: #000 !important;
}
.col-center label
{
font-style: italic;
padding: 5px;
}
#saveForm
{
border: 1px solid #000;
width: 150px;
height: 40px;
}
.insert
{
text-align: center;
padding-bottom: 15px;
}
.insert b
{
font-weight: lighter;
font-size: 32px;
}
.insert p
{
font-style: italic;
}
.italic
{
font-style: italic;
}
.bold
{
font-weight: bold;
}
li
{
padding: 10px;
}
http://codepen.io/anon/pen/xbMrBW
<div class="formWrapper">
<div class="col-center">
<div class="personalInformation">
<form>
<b>Personal Information</b>
<ul>
<li id="foli1" class="notranslate ">
<label class="desc" id="title1" for="Field1">
First Name
</label>
<input id="Field1" name="Field1" type="text" class="field text medium" value="" maxlength="255" tabindex="1" onkeyup="" placeholder="First Name" />
</li>
<li id="foli2" class="notranslate ">
<label class="desc" id="title2" for="Field2">
Last Name
</label>
<input id="Field2" name="Field2" type="text" class="field text medium" value="" maxlength="255" tabindex="2" onkeyup="" placeholder="Last Name" />
</li>
<li id="foli3" class="notranslate ">
<label class="desc" id="title3" for="Field3">
Phone Number
</label>
<input id="Field3" name="Field3" type="text" class="field text medium" value="" maxlength="255" tabindex="3" onkeyup="" placeholder="Phone Number" />
</li>
<li id="foli4" class="notranslate ">
<label class="desc" id="title4" for="Field4">
Email
</label>
<input id="Field4" name="Field4" type="text" class="field text medium" value="" maxlength="255" tabindex="4" onkeyup="" placeholder="Email" />
</li>
<li id="foli5" class="notranslate ">
<label class="desc" id="title5" for="Field5">
Address
</label>
<input id="Field5" name="Field5" type="text" class="field text medium" value="" maxlength="255" tabindex="5" onkeyup="" placeholder="Address" />
</li>
<li id="foli6" class="notranslate ">
<label class="desc" id="title6" for="Field6">
City
</label>
<input id="Field6" name="Field6" type="text" class="field text medium" value="" maxlength="255" tabindex="6" onkeyup="" placeholder="City" />
</li>
<li id="foli15" class="notranslate ">
<label class="desc" id="title15" for="Field15">
State
</label>
<select id="Field15" name="Field15" class="field select small" tabindex="7" >
<option value="" selected="selected">
</option>
<option value="Alabama" >
Alabama
</option>
<option value="Alaska" >
Alaska
</option>
<option value="Arizona" >
Arizona
</option>
<option value="Arkansas" >
Arkansas
</option>
<option value="California" >
California
</option>
<option value="Colorado" >
Colorado
</option>
<option value="Connecticut" >
Connecticut
</option>
<option value="Delaware" >
Delaware
</option>
<option value="Florida" >
Florida
</option>
<option value="Georgia" >
Georgia
</option>
<option value="Hawaii" >
Hawaii
</option>
<option value="Idaho" >
Idaho
</option>
<option value="Illinois" >
Illinois
</option>
<option value="Indiana" >
Indiana
</option>
<option value="Iowa" >
Iowa
</option>
<option value="Kansas" >
Kansas
</option>
<option value="Kentucky" >
Kentucky
</option>
<option value="Louisiana" >
Louisiana
</option>
<option value="Maine" >
Maine
</option>
<option value="Maryland" >
Maryland
</option>
<option value="Massachusetts" >
Massachusetts
</option>
<option value="Michigan" >
Michigan
</option>
<option value="Minnesota" >
Minnesota
</option>
<option value="Mississippi" >
Mississippi
</option>
<option value="Missouri" >
Missouri
</option>
<option value="Montana" >
Montana
</option>
<option value="Nebraska" >
Nebraska
</option>
<option value="Nevada" >
Nevada
</option>
<option value="New Hampshire" >
New Hampshire
</option>
<option value="New Jersey" >
New Jersey
</option>
<option value="New Mexico" >
New Mexico
</option>
<option value="New York" >
New York
</option>
<option value="North Carolina" >
North Carolina
</option>
<option value="North Dakota" >
North Dakota
</option>
<option value="Ohio" >
Ohio
</option>
<option value="Oklahoma" >
Oklahoma
</option>
<option value="Oregon" >
Oregon
</option>
<option value="Pennsylvania" >
Pennsylvania
</option>
<option value="Rhode Island" >
Rhode Island
</option>
<option value="South Carolina" >
South Carolina
</option>
<option value="South Dakota" >
South Dakota
</option>
<option value="Tennessee" >
Tennessee
</option>
<option value="Texas" >
Texas
</option>
<option value="Utah" >
Utah
</option>
<option value="Vermont" >
Vermont
</option>
<option value="Virginia" >
Virginia
</option>
<option value="Washington" >
Washington
</option>
<option value="West Virginia" >
West Virginia
</option>
<option value="Wisconsin" >
Wisconsin
</option>
<option value="Wyoming" >
Wyoming
</option>
</select>
</li>
<li id="foli11" class="notranslate ">
<label class="desc" id="title11" for="Field11">
Zip
</label>
<input id="Field11" name="Field11" type="text" class="field text small" value="" maxlength="255" tabindex="8" onkeyup="" placeholder="Zip" />
</li>
<li id="foli17" class="notranslate ">
<label class="desc" id="title17" for="Field17">
Website
</label>
<input id="Field17" name="Field17" type="text" class="field text medium" value="" maxlength="255" tabindex="9" onkeyup="" placeholder="Website" />
</li>
<li id="foli19" class="notranslate ">
<label class="desc" id="title19" for="Field19">
Instagram
</label>
<input id="Field19" name="Field19" type="text" class="field text medium" value="" maxlength="255" tabindex="10" onkeyup="" placeholder="Instagram" />
</li>
<li id="foli20" class="notranslate ">
<label class="desc" id="title20" for="Field20">
Facebook
</label>
<input id="Field20" name="Field20" type="text" class="field text medium" value="" maxlength="255" tabindex="11" onkeyup="" placeholder="Facebook" />
</li>
<li id="foli21" class="notranslate ">
<label class="desc" id="title21" for="Field21">
Twitter
</label>
<input id="Field21" name="Field21" type="text" class="field text medium" value="" maxlength="255" tabindex="12" onkeyup="" placeholder="Twitter" />
</li>
</div>
<div class="submissionInformation">
<b>Submission Information</b>
<li id="foli22" class="notranslate ">
<label class="desc" id="title22" for="Field22">
Medium
</label>
<select id="Field22" name="Field22" class="field select medium" tabindex="13" >
<option value="" selected="selected">
</option>
<option value="Paint" >
Paint
</option>
<option value="Illustration" >
Illustration
</option>
<option value="Photographer" >
Photographer
</option>
<option value="Sculptor" >
Sculptor
</option>
<option value="Jewelry" >
Jewelry
</option>
<option value="Maker" >
Maker
</option>
<option value="Mixed Media" >
Mixed Media
</option>
<option value="Other" >
Other
</option>
</select>
</li>
<li id="foli23" class="notranslate ">
<label class="desc" id="title23" for="Field23">
Other
</label>
<input id="Field23" name="Field23" type="text" class="field text medium" value="" maxlength="255" tabindex="14" onkeyup="" placeholder="Other" />
</li>
<li id="foli24" class="notranslate " >
<label class="desc" id="title24" for="Field24">
Piece 1
</label>
<input id="Field24" name="Field24" type="file" class="field file" size="12" tabindex="15" />
</li>
<li id="foli25" class="notranslate " >
<label class="desc" id="title25" for="Field25">
Piece 2
</label>
<input id="Field25" name="Field25" type="file" class="field file" size="12" tabindex="16" />
</li>
<li id="foli26" class="notranslate notStacked ">
<fieldset>
<![if !IE | (gte IE 8)]>
<legend id="title26" class="desc">
Is this your first showing?
</legend>
<![endif]>
<!--[if lt IE 8]>
<label id="title26" class="desc">
Is this your first showing?
</label>
<![endif]-->
<span>
<input id="Field26" name="Field26" type="checkbox" class="field checkbox" value="Yes" tabindex="17" />
<label class="choice" for="Field26">Yes</label>
</span>
<span>
<input id="Field27" name="Field27" type="checkbox" class="field checkbox" value="No" tabindex="18" />
<label class="choice" for="Field27">No</label>
</span>
</fieldset>
</li>
</div>
</div>
</div>
Thank you in advance.
One solution would be to style the labels this way :
label{
display:inline-block;
width:150px;
}
The inputs will all be aligned! If you also want to have the inputs have a fixed width (like in your picture), don't forget to style them too.
Hope it helps :)

Dynamically change form post action on submit

I am trying to have my form change post action dynamically based on a choice made in a dropdown once the user presses submit. i have gotten it to work once the choice is made, but that overrides my validation rules.
the url of the site I am working on is instaloan.glidewebdesign.com
based on a choice from the "Car Title Status" dropdown, I would like it submit a different post action based on the answer.
Thanks in advance for any and all help!!!!!!
function set_form_action()
{
if (page == 'clear_title')
{
window.location = 'https://secure.leads360.com/Import.aspx? Provider=TMXFinance&Client=TMXFinance&CampaignId=1034&Url=http://instaloan.glidewebdesign.com/index.php/thank-you';
}
else if (page == 'lien_on_title')
{
window.location = 'https://secure.leads360.com/Import.aspx?Provider=TMXFinance&Client=TMXFinance&CampaignId=1034&Url=http://instaloan.glidewebdesign.com/index.php/thank-you2';
}
else if (page == 'no_title')
{
window.location = 'https://secure.leads360.com/Import.aspx?Provider=TMXFinance&Client=TMXFinance&CampaignId=1034&Url=http://instaloan.glidewebdesign.com/index.php/thank-you3';
}
}
<form name="homeform" >
<fieldset>
<input name="first" type="text" class="name" placeholder=" First Name" maxlength="10" onkeyup="checkInput2(this)" required="required" />
<input name="last" type="text" class="name" placeholder=" Last Name" maxlength="15" onkeyup="checkInput2(this)" required="required" /></br>
<input name="phone" type='tel' pattern='^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$' title='Phone Number (Format: (999) 999-9999)' class="name" placeholder=" Phone Number" maxlength="10" onkeyup="checkInput(this)" required="required" />
<input name="zip" type="text" name="zipCode" value=""
pattern="[0-9]{5}([-][0-9]{4})?" placeholder=" Zip Code" class="name" maxlength="5" onkeyup="checkInput(this)" required="required" /></br>
<select name="amount" class="dropdown" value="Amount Requested">
<option value="0">Amount</option>
<option value="$100-$499">$100 - $499</option>
<option value="$500-$999">$500 - $999</option>
<option value="$1000-$1999">$1,000 - $1,999</option>
<option value="$2000-$2999">$2,000 - $2,999</option>
<option value="$3000+">$3,000+</option>
</select>
</br>
<select name="status" class="dropdown" value="Car Title Status" >
<option value="smt">Car Title Status</option>
<option value="clear_title">I have a clear car title</option>
<option value="lien_on_title">There′s a lien against my car title</option>
<option value="no_title">I don′t have a car title</option>
</select>
</br>
<input name="submit" type="submit" class="submit" value="Find Out Now" />
</fieldset>
</form>
OK...after pulling out the little hair I have left, I got it figured out...waht I was doing was completely wrong, for what I am trying to accomplish anyway. This is my final working code:
$("#homeform").submit(function(){
if($("#status").val() == "clear_title"){
$(this).attr("action","https://secure.leads360.com/Import.aspx? Provider=TMXFinance&Client=TMXFinance&CampaignId=1034&Url=http://instaloan.glidewebdesign.co m/index.php/thank-you");
}
else if($("#status").val() == "lien_on_title"){
$(this).attr("action","https://secure.leads360.com/Import.aspx? Provider=TMXFinance&Client=TMXFinance&CampaignId=1034&Url=http://instaloan.glidewebdesign.co m/index.php/thank-you2");
}
else if($("#status").val() == "no_title"){
$(this).attr("action","https://secure.leads360.com/Import.aspx? Provider=TMXFinance&Client=TMXFinance&CampaignId=1034&Url=http://instaloan.glidewebdesign.co m/index.php/thank-you3");
}
});
HTML:
<form id="homeform" name="homeform" method="post" action="">
<fieldset>
<input name="first" type="text" class="name" placeholder=" First Name" maxlength="10" onkeyup="checkInput2(this)" required="required" />
<input name="last" type="text" class="name" placeholder=" Last Name" maxlength="15" onkeyup="checkInput2(this)" required="required" /></br>
<input id="phone" name="phone" type='tel' pattern='^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$' title='Phone Number (Format: (999) 999-9999)' class="name" placeholder=" Phone Number" maxlength="10" required="required" />
<input name="zip" type="text" name="zipCode" value=""
pattern="[0-9]{5}([-][0-9]{4})?" placeholder=" Zip Code" class="name" maxlength="5" onkeyup="checkInput(this)" required="required" /></br>
<select name="amount" class="dropdown" value="Amount Requested">
<option value="0">Amount</option>
<option value="$100-$499">$100 - $499</option>
<option value="$500-$999">$500 - $999</option>
<option value="$1000-$1999">$1,000 - $1,999</option>
<option value="$2000-$2999">$2,000 - $2,999</option>
<option value="$3000+">$3,000+</option>
</select>
</br>
<select id="status" name="status" class="dropdown" value="Car Title Status" >
<option value="smt">Car Title Status</option>
<option value="clear_title">I have a clear car title</option>
<option value="lien_on_title">There′s a lien against my car title</option>
<option value="no_title">I don′t have a car title</option>
</select>
</br>
<input name="submit" type="submit" class="submit" value="Find Out Now" />
</fieldset>
</form>

Why isn't newly selected option sent to server when form is submitted? [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 5 months ago.
Improve this question
I have a select tag that is built like this:
<%= f.select(:id, category_options, include_blank:true) %>
The form displays fine and the appropriate model item's option tag is selected. However, when the user selects a different option and submits the form, the new option is not passed to the server. Instead, the originally selected value is passed to the server.
The rails log shows the old values being submitted, not the new ones. The values for this input appear to be cached.This happens in development and production, and in development cache_classes = false.
The rails log like this:
Started PUT "/posts/1999" for 127.0.0.1 at 2012-09-11 13:42:51 -0400
Processing by GalleriesController#update as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"...", "gallery"=>{"publish_on"=>"2012-09-18", "poster_file_temp"=>"", "thumb_file_temp"=>"", "models_attributes"=>{"0"=>{"id"=>"116", "_destroy"=>"false"}, "1"=>{"id"=>"6409", "_destroy"=>"false"}}, "categories_attributes"=>{"0"=>{"id"=>"59", "_destroy"=>"false"}}, "thumb_zip_input"=>"", "medium_zip_input"=>"", "large_zip_input"=>"", "website_url"=>"", "commit"=>"Upload", "id"=>"1999"}
The form looks like this:
<form accept-charset="UTF-8" action="/galleries/1999" class="edit_gallery" enctype="multipart/form-data" id="edit_gallery_1999" method="post" name="edit_gallery_1999">
<div style="margin:0;padding:0;display:inline">
<input name="utf8" type="hidden" value="✓"><input name="_method" type="hidden" value="put"><input name="authenticity_token" type="hidden" value="...">
</div>
<div class="vert">
<label for="gallery_publish_on">Publish on</label> <input id="gallery_publish_on" name="gallery[publish_on]" size="30" type="text" value="2012-09-18"> <label for="gallery_poster_file">Poster file</label> <input id="gallery_poster_file_temp" name="gallery[poster_file_temp]" type="hidden"><input id="gallery_poster_file" name="gallery[poster_file]" size="30" type="file">
<div class='formSection'>
<img alt="Brandy" src="/content/gallery/poster_file/0000/1999/brandy.jpg">
</div><label for="gallery_thumb_file">Thumb file</label> <input id="gallery_thumb_file_temp" name="gallery[thumb_file_temp]" type="hidden"><input id="gallery_thumb_file" name="gallery[thumb_file]" size="30" type="file">
<div class='formSection'>
<img alt="Thumb" src="/content/gallery/thumb_file/0000/1999/thumb.jpg">
</div>
<div id="models">
<label for="Models">Models</label>
<div>
<select id="gallery_models_attributes_0_id" name="gallery[models_attributes][0][id]">
<option value="6409">
April
</option>
<option value="6366" selected="selected">
Brandy
</option>
<option value="9036">
Charlie
</option>
<option value="7490">
Craig
</option>
<option value="9881">
Donna
</option>
</select> <input id="gallery_models_attributes_0__destroy" name="gallery[models_attributes][0][_destroy]" type="hidden" value="false"> remove
</div><input id="gallery_models_attributes_0_id" name="gallery[models_attributes][0][id]" type="hidden" value="6366"> add model
</div>
<div id="categories">
<label for="Categories">Categories</label>
<div>
<select id="gallery_categories_attributes_0_id" name="gallery[categories_attributes][0][id]">
<option value="1">
Amateur
</option>
<option value="2">
Animals
</option>
<option value="49">
Articles
</option>
<option value="3">
Art
</option>
<option value="7">
Blog
</option>
</select> <input id="gallery_categories_attributes_0__destroy" name="gallery[categories_attributes][0][_destroy]" type="hidden" value="false"> remove
</div><input id="gallery_categories_attributes_0_id" name="gallery[categories_attributes][0][id]" type="hidden" value="59"> add category
</div>
<div id='photoset_files'>
<fieldset>
<legend>Zip Files</legend> <label for="gallery_thumb_zip_input">thumb zip</label> <select id="gallery_thumb_zip_input" name="gallery[thumb_zip_input]">
<option value="/Library/WebServer/Documents/uploads/thumb copy.zip">
thumb copy.zip
</option>
<option value="/Library/WebServer/Documents/uploads/thumb.zip">
thumb.zip
</option>
</select> [ thumb.zip ]<br>
<label for="gallery_medium_zip_input">medium zip</label> <select id="gallery_medium_zip_input" name="gallery[medium_zip_input]">
<option value="/Library/WebServer/Documents/uploads/medium copy 10.zip">
medium copy 10.zip
</option>
<option value="/Library/WebServer/Documents/uploads/medium copy 9.zip">
medium copy 9.zip
</option>
<option value="/Library/WebServer/Documents/uploads/medium copy.zip">
medium copy.zip
</option>
<option value="/Library/WebServer/Documents/uploads/medium.zip">
medium.zip
</option>
</select> [ medium.zip ]<br>
<label for="gallery_large_zip_input">large zip</label> <select id="gallery_large_zip_input" name="gallery[large_zip_input]">
<option value="/Library/WebServer/Documents/uploads/large copy 10.zip">
large copy 10.zip
</option>
<option value="/Library/WebServer/Documents/uploads/large copy 9.zip">
large copy 9.zip
</option>
<option value="/Library/WebServer/Documents/uploads/large copy.zip">
large copy.zip
</option>
<option value="/Library/WebServer/Documents/uploads/large.zip">
large.zip
</option>
</select> [ large.zip ]<br>
</fieldset>
</div><label for="gallery_website_url">Website url</label> <input class="wider" id="gallery_website_url" name="gallery[website_url]" size="30" type="text" value=""> <input id="tluo" name="tluo" type="hidden" value="aHR0cDovL2tmLmRldi9nYWxsZXJpZXMvbGlzdA==">
<div id="submit">
<input data-disable-with="Uploading..." name="commit" type="submit" value="Upload"> Cancel
</div>
</div>
</form>
This is because you are repeating the id and name attribute of select . This is not recommended to have two html elements with same id values
try to change name of select or if you want to use this as array then specifying name this way may help you out
gallery[categories_attributes][0][id][]
This one I used to collect checked radio button values, it may work in your case