(Undo revision 65819 by Www.jsponsel.com (Talk) (spam links)) |
Current revision (05:58, 4 April 2017) (view source) (fix upcoming link) |
||
Line 1,267: | Line 1,267: | ||
==== Upcoming ==== | ==== Upcoming ==== | ||
- | * http://upcoming. | + | * http://upcoming.org/ - when creating a new venue as part of creating a new event http://upcoming.org/event/add/ |
Input form markup simplified a bit with much presentational markup removed, whitespace added for readability: | Input form markup simplified a bit with much presentational markup removed, whitespace added for readability: |
Current revision
This page is for documenting real world examples of web forms that input contact information (people or organizations/venues) towards brainstorming the use of hCard for input into forms for enabling hCard forms auto-fill and hCard copy + paste.
Contents |
examples
person info input
- Nearly every social network site's "sign up" / register / registration form.
E.g. see hcard-supporting-user-profiles.
Specific examples:
Yelp sign up
- http://yelp.com/ - when signing up for a new account: https://www.yelp.com/signup
Input form markup simplified a bit with presentational markup removed, whitespace adjusted for readability:
<form class="signup" method="post" action="/signup" name="signup_form"> <fieldset> <input type="hidden" name="action_submit" value="1"/> <ol> <li><label for="signup-first-name">First Name:</label> <input id="signup-first-name" type="text" maxlength="32" name="first_name" value=""/> </li> <li><label for="signup-last-name">Last Name:</label> <input id="signup-last-name"type="text" maxlength="32" name="last_name" value=""/> </li> <li><label for="signup-address">Email Address:</label> <input id="signup-address" type="text" maxlength="64" name="email" value=""/> <p class="formNote">We loathe spam even more than you do. We will NOT sell your email address.</p> </li> <li><label for="signup-password">Password:</label> <input id="signup-password" type="password" maxlength="16" name="password" value=""/> </li> <li><label for="signup-password-confirm">Retype Password:</label> <input id="signup-password-confirm" type="password" maxlength="16" name="confirm_password" value=""/> </li> <li><label for="signup-zip">Zip Code:</label> <input id="signup-zip" type="text" class="zip" name="zip" value=""/> <span class="other-countries"> <em>Not in the U.S.?</em> <input type="hidden" name="other_country" value=""> <a href="http://www.yelp.ca/signup" class="ca" rel="CA" alt="I live in Canada">CA</a> <a href="http://www.yelp.ie/signup" class="ie" rel="IE" alt="I live in Ireland">IE</a> <a href="http://www.yelp.co.uk/signup" class="gb" rel="GB" alt="I live in the U.K.">GB</a> </span> </li> <li class="gender"> <span class="gender-label">Gender:<span class="formNote">(Optional)</span></span> <label for="signup-gender-male"> <input id="signup-gender-male" class="gender" type="radio" name="gender" value="m" /> Male</label> <label for="signup-gender-female"> <input id="signup-gender-female" class="gender" type="radio" name="gender" value="f" /> Female</label> </li> <li class="birthdate"> <label for="signup-birthdate">Birthdate:<span class="formNote">(Optional)</span></label> <select name="birthdate_m"> <option value="">---</option> <option value="1" >Jan</option> <option value="2" >Feb</option> <option value="3" >Mar</option> <option value="4" >Apr</option> <option value="5" >May</option> <option value="6" >Jun</option> <option value="7" >Jul</option> <option value="8" >Aug</option> <option value="9" >Sep</option> <option value="10" >Oct</option> <option value="11" >Nov</option> <option value="12" >Dec</option> </select> <select name="birthdate_d"> <option value="">--</option> <option value="1" >1</option> <option value="2" >2</option> <option value="3" >3</option> <option value="4" >4</option> <option value="5" >5</option> <option value="6" >6</option> <option value="7" >7</option> <option value="8" >8</option> <option value="9" >9</option> <option value="10" >10</option> <option value="11" >11</option> <option value="12" >12</option> <option value="13" >13</option> <option value="14" >14</option> <option value="15" >15</option> <option value="16" >16</option> <option value="17" >17</option> <option value="18" >18</option> <option value="19" >19</option> <option value="20" >20</option> <option value="21" >21</option> <option value="22" >22</option> <option value="23" >23</option> <option value="24" >24</option> <option value="25" >25</option> <option value="26" >26</option> <option value="27" >27</option> <option value="28" >28</option> <option value="29" >29</option> <option value="30" >30</option> <option value="31" >31</option> </select> <select name="birthdate_y"> <option value="">----</option> <option value="1993" >1993</option> <option value="1992" >1992</option> <option value="1991" >1991</option> <option value="1990" >1990</option> <option value="1989" >1989</option> <option value="1988" >1988</option> <option value="1987" >1987</option> <option value="1986" >1986</option> <option value="1985" >1985</option> <option value="1984" >1984</option> <option value="1983" >1983</option> <option value="1982" >1982</option> <option value="1981" >1981</option> <option value="1980" >1980</option> <option value="1979" >1979</option> <option value="1978" >1978</option> <option value="1977" >1977</option> <option value="1976" >1976</option> <option value="1975" >1975</option> <option value="1974" >1974</option> <option value="1973" >1973</option> <option value="1972" >1972</option> <option value="1971" >1971</option> <option value="1970" >1970</option> <option value="1969" >1969</option> <option value="1968" >1968</option> <option value="1967" >1967</option> <option value="1966" >1966</option> <option value="1965" >1965</option> <option value="1964" >1964</option> <option value="1963" >1963</option> <option value="1962" >1962</option> <option value="1961" >1961</option> <option value="1960" >1960</option> <option value="1959" >1959</option> <option value="1958" >1958</option> <option value="1957" >1957</option> <option value="1956" >1956</option> <option value="1955" >1955</option> <option value="1954" >1954</option> <option value="1953" >1953</option> <option value="1952" >1952</option> <option value="1951" >1951</option> <option value="1950" >1950</option> <option value="1949" >1949</option> <option value="1948" >1948</option> <option value="1947" >1947</option> <option value="1946" >1946</option> <option value="1945" >1945</option> <option value="1944" >1944</option> <option value="1943" >1943</option> <option value="1942" >1942</option> <option value="1941" >1941</option> <option value="1940" >1940</option> <option value="1939" >1939</option> <option value="1938" >1938</option> <option value="1937" >1937</option> <option value="1936" >1936</option> <option value="1935" >1935</option> <option value="1934" >1934</option> <option value="1933" >1933</option> <option value="1932" >1932</option> <option value="1931" >1931</option> <option value="1930" >1930</option> <option value="1929" >1929</option> <option value="1928" >1928</option> <option value="1927" >1927</option> <option value="1926" >1926</option> <option value="1925" >1925</option> <option value="1924" >1924</option> <option value="1923" >1923</option> <option value="1922" >1922</option> <option value="1921" >1921</option> <option value="1920" >1920</option> <option value="1919" >1919</option> <option value="1918" >1918</option> <option value="1917" >1917</option> <option value="1916" >1916</option> <option value="1915" >1915</option> <option value="1914" >1914</option> <option value="1913" >1913</option> <option value="1912" >1912</option> <option value="1911" >1911</option> <option value="1910" >1910</option> <option value="1909" >1909</option> <option value="1908" >1908</option> <option value="1907" >1907</option> <option value="1906" >1906</option> <option value="1905" >1905</option> <option value="1904" >1904</option> <option value="1903" >1903</option> <option value="1902" >1902</option> <option value="1901" >1901</option> </select> </li> </ol> <p class="smaller fine-print">By clicking the button below, you agree to the Yelp <a href="/static?p=tos&country=US">Terms of Service</a> and <a href="/static?p=privacy&country=US">Privacy Policy</a>.</p> <p><input type="image" id="signUpButton" src="https://images.yelp.com/static/20090605/i/new/btn/signup.gif"></p> </fieldset> </form>
person billing shipping input
Shopping check out forms for ecommerce of virtual or physical items. What ecommerce sites ask for upon checking out, your shopping cart, etc. to make a purchase.
Specific examples:
Advance Auto Parts
- http://shop.advanceautoparts.com, search for an item, enter your zip code, add to cart, checkout.
Input form markup simplified a bit with scripting/presentational markup removed, whitespace adjusted for readability:
... <tbody><tr><td id="bill-form"> <div> <h3>Billing Address<a name="create" id="create"></a></h3> <p> <input name="billingShippingSame" tabindex="6" value="false" title="Billing Shipping Same" type="checkbox"> Make shipping the same as my billing address </p> <h4>Use form below for your billing address:</h4> <table> <tbody><tr> <th class="required-text">* required fields</th> </tr> <tr> <th><span class="required-text">*</span>First Name:</th> <td><input name="billFirstName" maxlength="40" tabindex="10" value="" id="billFirstName" title="billFirstName" type="text"></td> </tr> <tr> <th><span class="required-text">*</span>Last Name:</th> <td><input name="billLastName" maxlength="40" tabindex="11" value="" title="billLastName" type="text"></td> </tr> <tr> <th><span class="required-text">*</span>Street Address 1:</th> <td><input name="billAddress1" maxlength="49" tabindex="12" value="" title="billAddress1" type="text"></td> </tr> <tr> <th>Street Address 2:</th> <td><input name="billAddress2" maxlength="49" tabindex="13" value="" title="billAddress2" type="text"></td> </tr> <tr> <th><span class="required-text">*</span>City:</th> <td><input name="billCity" maxlength="40" tabindex="14" value="" title="billCity" type="text"></td> </tr> <tr> <th></th> <td>(Military Customers, enter APO/FPO/DPO for city)</td> </tr> <input name="billCountry" value="US" type="hidden"> <tr> <th><span class="required-text">*</span>State:</th> <td> <select name="billState" tabindex="15" title="billState"> <option value="AL">Alabama</option> <option value="AK">Alaska</option> <option value="AS">American Samoa</option> <option value="AZ">Arizona</option> <option value="AR">Arkansas</option> <option value="AA">Armed Forces Americas</option> <option value="AE">Armed Forces Europe</option> <option value="AP">Armed Forces Pacific</option> <option value="CA">California</option> <option value="CO">Colorado</option> <option value="CT">Connecticut</option> <option value="DE">Delaware</option> <option value="DC">District of Columbia</option> <option value="FL">Florida</option> <option value="GA">Georgia</option> <option value="GU">Guam</option> <option value="HI">Hawaii</option> <option value="ID">Idaho</option> <option value="IL">Illinois</option> <option value="IN">Indiana</option> <option value="IA">Iowa</option> <option value="KS">Kansas</option> <option value="KY">Kentucky</option> <option value="LA">Louisiana</option> <option value="ME">Maine</option> <option value="MD">Maryland</option> <option value="MA">Massachusetts</option> <option value="MI">Michigan</option> <option value="MN">Minnesota</option> <option value="MS">Mississippi</option> <option value="MO">Missouri</option> <option value="MT">Montana</option> <option value="NE">Nebraska</option> <option value="NV">Nevada</option> <option value="NH">New Hampshire</option> <option value="NJ">New Jersey</option> <option value="NM">New Mexico</option> <option value="NY">New York</option> <option value="NC">North Carolina</option> <option value="ND">North Dakota</option> <option value="MP">Northern Mariana Islands</option> <option value="OH">Ohio</option> <option value="OK">Oklahoma</option> <option value="OR">Oregon</option> <option value="PA">Pennsylvania</option> <option value="PR">Puerto Rico</option> <option value="RI">Rhode Island</option> <option value="SC">South Carolina</option> <option value="SD">South Dakota</option> <option value="TN">Tennessee</option> <option value="TX">Texas</option> <option value="UT">Utah</option> <option value="VT">Vermont</option> <option value="VI">Virgin Islands</option> <option value="VA">Virginia</option> <option value="WA">Washington</option> <option value="WV">West Virginia</option> <option value="WI">Wisconsin</option> <option value="WY">Wyoming</option></select> </td> </tr> <tr> <th><span class="required-text">*</span>Zip Code:</th> <td><input name="billZipCode" maxlength="10" tabindex="16" value="" title="billZipCode" type="text"></td> </tr> <tr> <th><span class="required-text">*</span>Day Phone:</th> <td> (<input name="billDayPhonePart1" maxlength="3" tabindex="17" value="" title="billDayPhonePart1" type="text">) <input name="billDayPhonePart2" maxlength="3" tabindex="19" value="" title="billDayPhonePart2" type="text"> <input name="billDayPhonePart3" maxlength="4" tabindex="20" value="" title="billDayPhonePart3" type="text"> </td> </tr> <tr> <th><span class="required-text">*</span>Email Address:</th> <td><input name="billEmail" maxlength="50" tabindex="21" value="" title="billEmail" type="text"></td> </tr> <tr> <td colspan="2"> <input name="sendMeEmail" tabindex="22" value="checked" checked="checked" title="sendMeEmail" type="checkbox"> Yes, please send me emails about news, special offers, exclusives and promotions from Advance Auto Parts. See our <a href="https://shop.advanceautoparts.com/webapp/wcs/stores/servlet/content_privacypolicy___" target="_blank"> Privacy Policy. </a> <input name="receiveEmail" value="" type="hidden"> </td> </tr> </tbody></table> </div> </td> <td> </td> <td id="ship-form"> <input name="hasDeliveryItems" value="true" type="hidden"> <h3>Shipping Address</h3> <div id="ship-area"> <input name="shipAddressId" value="" type="hidden"> <h4>Add a new shipping address:</h4> <table> <tbody><tr> <th class="required-text">* required fields</th> </tr> <tr> <th>*First Name:</th> <td><input name="shipFirstName" maxlength="40" tabindex="115" value="" title="shipFirstName" type="text"></td> </tr> <tr> <th>*Last Name:</th> <td><input name="shipLastName" maxlength="40" tabindex="116" value="" title="shipLastName" type="text"></td> </tr> <tr> <th>*Street Address 1:</th> <td><input name="shipAddress1" maxlength="49" tabindex="118" value="" title="shipAddress1" type="text"></td> </tr> <tr> <th>Street Address 2:</th> <td><input name="shipAddress2" maxlength="49" tabindex="119" value="" title="shipAddress2" type="text"></td> </tr> <tr> <th>*City:</th> <td><input name="shipCity" maxlength="40" tabindex="120" value="" title="shipCity" type="text"></td> </tr> <tr> <th></th> <td>(Military Customers, enter APO/FPO/DPO for city)</td> </tr> <input name="shipCountry" value="US" type="hidden"> <tr> <th>*State:</th> <td> <select name="shipState" tabindex="122" title="shipState"> <option value="AL">Alabama</option> <option value="AK">Alaska</option> <option value="AS">American Samoa</option> <option value="AZ">Arizona</option> <option value="AR">Arkansas</option> <option value="AA">Armed Forces Americas</option> <option value="AE">Armed Forces Europe</option> <option value="AP">Armed Forces Pacific</option> <option value="CA">California</option> <option value="CO">Colorado</option> <option value="CT">Connecticut</option> <option value="DE">Delaware</option> <option value="DC">District of Columbia</option> <option value="FL">Florida</option> <option value="GA">Georgia</option> <option value="GU">Guam</option> <option value="HI">Hawaii</option> <option value="ID">Idaho</option> <option value="IL">Illinois</option> <option value="IN">Indiana</option> <option value="IA">Iowa</option> <option value="KS">Kansas</option> <option value="KY">Kentucky</option> <option value="LA">Louisiana</option> <option value="ME">Maine</option> <option value="MD">Maryland</option> <option value="MA">Massachusetts</option> <option value="MI">Michigan</option> <option value="MN">Minnesota</option> <option value="MS">Mississippi</option> <option value="MO">Missouri</option> <option value="MT">Montana</option> <option value="NE">Nebraska</option> <option value="NV">Nevada</option> <option value="NH">New Hampshire</option> <option value="NJ">New Jersey</option> <option value="NM">New Mexico</option> <option value="NY">New York</option> <option value="NC">North Carolina</option> <option value="ND">North Dakota</option> <option value="MP">Northern Mariana Islands</option> <option value="OH">Ohio</option> <option value="OK">Oklahoma</option> <option value="OR">Oregon</option> <option value="PA">Pennsylvania</option> <option value="PR">Puerto Rico</option> <option value="RI">Rhode Island</option> <option value="SC">South Carolina</option> <option value="SD">South Dakota</option> <option value="TN">Tennessee</option> <option value="TX">Texas</option> <option value="UT">Utah</option> <option value="VT">Vermont</option> <option value="VI">Virgin Islands</option> <option value="VA">Virginia</option> <option value="WA">Washington</option> <option value="WV">West Virginia</option> <option value="WI">Wisconsin</option> <option value="WY">Wyoming</option></select> </td> </tr> <tr> <th>*Zip Code:</th> <td><input name="shipZipCode" maxlength="10" tabindex="123" value="" title="shipZipCode" type="text"></td> </tr> <tr> <th>*Day Phone:</th> <td> (<input name="shipDayPhonePart1" maxlength="3" tabindex="124" value="" title="shipDayPhonePart1" type="text">) <input name="shipDayPhonePart2" maxlength="3" tabindex="125" value="" title="shipDayPhonePart2" type="text"> <input name="shipDayPhonePart3" maxlength="4" tabindex="126" value="" title="shipDayPhonePart3" type="text"></td> </tr> <tr> <th>Night Phone:</th> <td> (<input name="shipNightPhonePart1" maxlength="3" tabindex="127" value="" title="shipNightPhonePart1" type="text">) <input name="shipNightPhonePart2" maxlength="3" tabindex="128" value="" title="shipNightPhonePart2" type="text"> <input name="shipNightPhonePart3" maxlength="4" tabindex="129" value="" title="shipNightPhonePart3" type="text"> </td> </tr> </tbody></table> </div> </td> </tr> </tbody> ...
American Eagle
- https://www.ae.com/, search for an item, add to bag, checkout, guest checkout.
Input form markup simplified a bit with scripting/presentational/divitis markup removed, whitespace adjusted for readability:
Step 1:
... <div class="accordionStep accordionOpen" id="shippingInfoStep"> <h2 class="stepTitle">Step 1: Shipping Info</h2> <div class="stepBody"> <form id="checkoutShippingInfoForm" action="https://www.ae.com/web/checkout/checkout.jsp?_DARGS=/web/checkout/checkout.jsp.shippingMethodFid" class="accordionTrigger" method="post"> <input name="_dyncharset" value="UTF-8" type="hidden"> <input name="_dynSessConf" value="xyz" type="hidden"> <input name="countryType" value="usa" disabled="disabled" type="hidden"> <input name="_D:countryType" value=" " type="hidden"> <input name="country" value="US" disabled="disabled" type="hidden"> <input name="_D:country" value=" " type="hidden"> <input name="firstName" value="" disabled="disabled" type="hidden"> <input name="_D:firstName" value=" " type="hidden"> <input name="lastName" value="" disabled="disabled" type="hidden"> <input name="_D:lastName" value=" " type="hidden"> <input name="address1" value="" disabled="disabled" type="hidden"> <input name="_D:address1" value=" " type="hidden"> <input name="address2" value="" disabled="disabled" type="hidden"> <input name="_D:address2" value=" " type="hidden"> <input name="city" value="" disabled="disabled" type="hidden"> <input name="_D:city" value=" " type="hidden"> <input name="state" value="" disabled="disabled" type="hidden"> <input name="_D:state" value=" " type="hidden"> <input name="zip" value="" disabled="disabled" type="hidden"> <input name="_D:zip" value=" " type="hidden"> <input name="existing" value="" disabled="disabled" type="hidden"> <input name="_D:existing" value=" " type="hidden"> <input name="/atg/commerce/order/checkout/ShippingGroupFormHandler.applyShippingGroupsSuccessURL" value="https://www.ae.com/web/checkout/checkout.jsp" type="hidden"> <input name="_D:/atg/commerce/order/checkout/ShippingGroupFormHandler.applyShippingGroupsSuccessURL" value=" " type="hidden"> <input name="/atg/commerce/order/checkout/ShippingGroupFormHandler.applyShippingGroupsErrorURL" value="https://www.ae.com/web/checkout/checkout.jsp" type="hidden"> <input name="_D:/atg/commerce/order/checkout/ShippingGroupFormHandler.applyShippingGroupsErrorURL" value=" " type="hidden"> <input name="ajaxSuccess" value="checkout_htmljax.jsp" type="hidden"> <input name="_D:ajaxSuccess" value=" " type="hidden"> <input name="ajaxError" value="checkout_htmljax.jsp" type="hidden"> <input name="_D:ajaxError" value=" " type="hidden"> <div id="shippingAddressFields"> <div class="checkoutFieldsetHolder" id="countryTypeBoxShipAddField"> <div class="checkoutBlock fieldset_bg"> <h3 class="uppercase">Shipping Country Type </h3> <div class="inputLabelHolder"> <label for="countryTypeShipAddField">Country Type </label> <input tabindex="0" id="countryTypeShipAddField" class="sel_field pseudoSelect" readonly="readonly" type="text"> <input value="usa" name="countryType" type="hidden"> </div> </div> </div> <div class="checkoutFieldsetHolder in_field_form" id="notCountryTypeBoxShipAddField"> <div class="checkoutBlock fieldset_bg"> <h3 class="infoTitle">Shipping Address </h3> <div class="inputLabelHolder fullField"> <label for="countryShipAddField">Country, APO/FPO </label> <input tabindex="0" id="countryShipAddField" class="sel_field pseudoSelect" readonly="readonly" type="text"> <input value="US" name="country" type="hidden"> </div> <div class="inputLabelHolder"> <label for="firstNameShipAddField">First Name </label> <input name="firstName" value="" id="firstNameShipAddField" class="in_field nameField" maxlength="12" type="text"> </div> <div class="inputLabelHolderLast"> <label for="lastNameShipAddField">Last Name </label> <input name="lastName" value="" id="lastNameShipAddField" class="in_field nameField" maxlength="15" type="text"> </div> <div class="inputLabelHolderLast"> <label for="address1ShipAddField">Address </label> <input name="address1" value="" id="address1ShipAddField" class="in_field addressField" maxlength="30" type="text"> <input name="address2" value="" id="address2ShipAddField" class="in_field addressField" maxlength="30" type="text"> </div> <div id="cityStateShipAddFieldHolder"> <div class="inputLabelHolder"> <label class="sm_label" for="cityShipAddField">City </label> <input name="city" value="" id="cityShipAddField" class="in_field cityField" maxlength="20" type="text"> </div> <div class="inputLabelHolder"> <label class="sm_label" for="stateShipAddField">State </label> <input tabindex="0" id="stateShipAddField" class="sel_field stateField pseudoSelect" readonly="readonly" type="text"> <input value="" name="state" type="hidden"> </div> <div class="inputLabelHolderLast"> <label class="sm_label" for="zipShipAddField">Zip </label> <input name="zip" value="" id="zipShipAddField" class="in_field zipField" maxlength="9" type="text"> </div> </div> </div> </div> </div> <input name="shippingChoice" value="Standard" disabled="disabled" type="hidden"> <input name="_D:shippingChoice" value=" " type="hidden"> <div class="checkoutFieldsetHolder" id="shippingMethodsFields"> <div class="checkoutBlock fieldset_bg"> <h3 class="infoTitle">Shipping Method <img class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </h3> <p>Place this order by 1PM EST to get it by the <strong>estimated dates </strong> below: </p> <div class="checkoutRadio rad_bttn shipMethodStandard shipMethodRadio rad_bttn_checked"> <div class="hiddenElement"> <input name="shippingChoice" id="standardShip" value="Standard" checked="checked" class="jsRadio" type="radio"> </div> <label for="standardShip" class="clickMe"> <span class="nameShipMethodStd shipMethodName">Standard </span> <span class="daysShipMethod">3 - 7 business days </span> <br> <span class="arrivalShipMethod">date: Jul 31 - Aug 06 </span> <br> <span class="costShipMethod"> $7 <br> </span> </label> <span class="checkedRadioMarker">✓ </span> </div> <div class="checkoutRadio rad_bttn shipMethodSecondDay shipMethodRadio rad_bttn_hoverable"> <div class="hiddenElement"> <input name="shippingChoice" id="twoDayShip" value="SecondDay" class="jsRadio" type="radio"> </div> <label for="twoDayShip" class="clickMe" id="chkOutTwoDayShipLabel"> <span class="nameShipMethod2nd shipMethodName">Two Day </span> <span class="daysShipMethod">2 business days </span> <br> <span class="arrivalShipMethod">date: Jul 30 </span> <br> <span class="costShipMethod"> $15 <br> </span> </label> <span class="checkedRadioMarker">✓ </span> </div> <div class="checkoutRadio rad_bttn shipMethodOvernight shipMethodRadio rad_bttn_hoverable"> <div class="hiddenElement"> <input name="shippingChoice" id="overnightShip" value="Overnight" class="jsRadio" type="radio"> </div> <label for="overnightShip" class="clickMe" id="chkOutOvernightShipLabel"> <span class="nameShipMethodOver shipMethodName">Overnight </span> <span class="daysShipMethod">1 business day </span> <br> <span class="arrivalShipMethod">date: Jul 27 </span> <br> <span class="costShipMethod"> $20 <br> </span> </label> <span class="checkedRadioMarker">✓ </span> </div> <div class="clearer"> </div> </div> </div> <div class="stepSubmitPadding"> <input id="shippingFormSubmit" name="submit" value="▸ Next Step" class="nextStepbtn strong_bttn js_submitForm" type="submit"> <input name="_D:submit" value=" " type="hidden"> </div> <input name="_DARGS" value="/web/checkout/checkout.jsp.shippingMethodFid" type="hidden"> </form> </div> <div class="stepComplete" id="shippingFormComplete"> <div class="checkoutBlock fieldset_bg"> <div id="shippingAddressComplete"> <h3 class="infoTitle">Shipping Address </h3> <div class="stepOutputHolder"> <p class="firstLineHeader"> <span id="firstNameShipAddFieldOutput"> </span> <span id="lastNameShipAddFieldOutput"> </span> </p> <p id="streetOneShipAddFieldOutput"> </p> <p id="streetTwoShipAddFieldOutput"> </p> <p> <span id="cityShipAddFieldOutput"> </span>, <span id="stateShipAddFieldOutput"> </span> <span id="zipShipAddFieldOutput"> </span> </p> <p id="countryShipAddFieldOutput"> United States </p> </div> </div> <div id="shippingMethodComplete"> <h3 class="infoTitle">Shipping Method </h3> <div class="stepOutputHolder"> <p class="firstLineHeader"> <span id="shippingMethodOutput">Standard </span> <span id="shippingPriceOutput"> FREE </span> </p> <p id="deliveryTimeOutput">3 - 7 Business Days </p> <p class="firstLineHeader">Estimated Delivery </p> <p id="estDeliveryOutput">Jul 31 - Aug 06 </p> </div> </div> <div id="editStepOne"> <a class="stepEdit sm_bttn" href="checkout.jsp?clearStepOne=true">Edit </a> </div> <div class="clearer"> </div> </div> </div> </div> ...
Step 2:
... <h2 class="stepTitle">Step 2: Payment Info</h2> <div class="stepBody"> <div id="billingGiftCards"> <div class="checkoutFieldsetHolder"> <div class="checkoutBlock fieldset_bg"> <h3 class="infoTitle">Payment Methods</h3> <p>Please select how you would like to pay for this order.</p> <div id="giftCardHolder"> <a href="#" id="giftCardBtn" class="giftCardOff"> <span>Gift Card</span> </a> <div id="giftCardWrapper" style="display: none;" class="paymentTabBodyWrapper"> <div class="paymentTabTop"> </div> <div class="paymentTabInnerBody"> <div id="gcPaymentTabBody" class="paymentTabBody"> <p>You can apply up to 3 gift cards.</p> <form id="applyGiftCard" name="applyGiftCard" action="/web/checkout/checkout.jsp"> <input name="_dyncharset" value="UTF-8" type="hidden"> <input name="_dynSessConf" value="xyz" type="hidden"> <input name="/aeo/commerce/order/checkout/AeoGiftCardPaymentHandler.successURL" value="/web/checkout/checkout.jsp" type="hidden"> <input name="_D:/aeo/commerce/order/checkout/AeoGiftCardPaymentHandler.successURL" value=" " type="hidden"> <input name="/aeo/commerce/order/checkout/AeoGiftCardPaymentHandler.errorURL" value="/web/checkout/checkout.jsp" type="hidden"> <input name="_D:/aeo/commerce/order/checkout/AeoGiftCardPaymentHandler.errorURL" value=" " type="hidden"> <input name="ajaxSuccess" value="checkout_htmljax.jsp" type="hidden"> <input name="_D:ajaxSuccess" value=" " type="hidden"> <input name="ajaxError" value="checkout_htmljax.jsp" type="hidden"> <input name="_D:ajaxError" value=" " type="hidden"> <input name="giftNumEntry" value="" disabled="disabled" type="hidden"> <input name="_D:giftNumEntry" value=" " type="hidden"> <input name="pinNumEntry" value="" disabled="disabled" type="hidden"> <input name="_D:pinNumEntry" value=" " type="hidden"> <div class="inputLabelHolder"> <label for="giftNumEntry">Gift Card Number: <img style="" class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input name="giftNumEntry" id="giftNumEntry" class="in_field giftNumEntryField" value="" maxlength="19" autocomplete="off" type="text"> </div> <div class="inputLabelHolder"> <label for="pinNumEntry">PIN:</label> <input autocomplete="off" name="pinNumEntry" id="pinNumEntry" class="in_field pinNumEntryField" value="" maxlength="4" type="text"> </div> <input id="applyGiftCardBtn" name="/aeo/commerce/order/checkout/AeoGiftCardPaymentHandler.applyGiftCard" value="Apply Card" class="strong_bttn" type="submit"> <input name="_D:/aeo/commerce/order/checkout/AeoGiftCardPaymentHandler.applyGiftCard" value=" " type="hidden"> <input name="_DARGS" value="/web/checkout/billing/giftCard.jsp.applyGiftCardFid" type="hidden"> </form> </div> </div> </div> </div> </div> </div> </div> <form id="checkoutBillingInfoForm" action="https://www.ae.com/web/checkout/checkout.jsp?_DARGS=/web/checkout/checkout.jsp.billingMethodFid" class="accordionTrigger" method="post"> <input name="_dyncharset" value="UTF-8" type="hidden"> <input name="_dynSessConf" value="xyz" type="hidden"> <input name="ccType" value="" disabled="disabled" type="hidden"> <input name="_D:ccType" value=" " type="hidden"> <input name="ccNumber" value="" disabled="disabled" type="hidden"> <input name="_D:ccNumber" value=" " type="hidden"> <input name="ccSecCode" value="" disabled="disabled" type="hidden"> <input name="_D:ccSecCode" value=" " type="hidden"> <input name="expMonth" value="" disabled="disabled" type="hidden"> <input name="_D:expMonth" value=" " type="hidden"> <input name="expYear" value="" disabled="disabled" type="hidden"> <input name="_D:expYear" value=" " type="hidden"> <input name="birthDayBMLField" value="" disabled="disabled" type="hidden"> <input name="_D:birthDayBMLField" value=" " type="hidden"> <input name="birthMonthBMLField" value="" disabled="disabled" type="hidden"> <input name="_D:birthMonthBMLField" value=" " type="hidden"> <input name="birthYearBMLField" value="" disabled="disabled" type="hidden"> <input name="_D:birthYearBMLField" value=" " type="hidden"> <input name="SSN" value="" disabled="disabled" type="hidden"> <input name="_D:SSN" value=" " type="hidden"> <input name="agree" value="" disabled="disabled" type="hidden"> <input name="_D:agree" value=" " type="hidden"> <input name="agreeTs" value="" disabled="disabled" type="hidden"> <input name="_D:agreeTs" value=" " type="hidden"> <input name="checkoutPaymentType" value="" disabled="disabled" type="hidden"> <input name="_D:checkoutPaymentType" value=" " type="hidden"> <div id="paymentInfoBlock"> <div class="checkoutFieldsetHolder in_field_form"> <div class="checkoutBlock fieldset_bg"> <div id="paymentTabs"> <input id="checkoutPaymentType" name="checkoutPaymentType" value="creditCardPayment" type="hidden"> <ul id="paymentTabLinks"> <li id="ccPaymentTabLink" class="tabOn"> <a>Credit Card</a> </li> <li id="ppPaymentTabLink"> <a>Paypal</a> </li> <li id="bmlPaymentTabLink"> <a>BillMeLater<sup>®</sup> </a> </li> </ul> <div class="paymentTabBodyWrapper"> <div class="paymentTabTop"> </div> <div class="paymentTabInnerBody"> <div id="ccPaymentTabBody" class="paymentTabBody tabBodyOn"> <div class="inputLabelHolder"> <label for="ccTypeCCField">Card Type:</label> <input tabindex="0" id="ccTypeCCField" class="sel_field ccTypeField pseudoSelect" readonly="readonly" type="text"> <input value="" name="ccType" type="hidden"> </div> <div id="ccNumberHolderCCField" class="inputLabelHolder"> <label for="ccNumberCCField">Card Number:</label> <input name="ccNumber" id="ccNumberCCField" size="30" maxlength="16" value="" class="in_field ccNumberField" autocomplete="off" type="text"> </div> <div id="expDateCCField" class="inputLabelHolder"> <label for="expMonthCCField">Expiration <span>(Month / Year)</span>:</label> <input tabindex="0" id="expMonthCCField" class="sel_field expMonthField pseudoSelect" readonly="readonly" type="text"> <input value="1" name="expMonth" type="hidden"> <input tabindex="0" id="expYearCCField" class="sel_field expYearField pseudoSelect" readonly="readonly" type="text"> <input value="2012" name="expYear" type="hidden"> </div> <div id="ccSecCodeHolderCCField" class="inputLabelHolder"> <label for="ccSecCodeCCField">Security Code: <img style="" class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input name="ccSecCode" id="ccSecCodeCCField" size="4" maxlength="4" value="" class="in_field ccSecCodeField" autocomplete="off" type="text"> </div> </div> <div style="display: none;" id="ppPaymentTabBody" class="paymentTabBody tabBodyDisabled"> <h3>You have chosen PayPal as your payment method.</h3> <p>Continue to Step 3 where you will be able to Login to PayPal and complete your order.</p> </div> <div style="display: none;" id="bmlPaymentTabBody" class="paymentTabBody tabBodyDisabled"> <p class="noticeField"> <span class="noticeShout">!</span>Bill Me Later<sup>®</sup> is only available to US residents. <a href="https://www.securecheckout.billmelater.com/paycapture-content/fetch?hash=BPU23UPB&content=/bmlweb/coreiw.html" id="bmlLearnMore" title="Learn more." target="_blank">Learn more</a>.</p> <h3 class="infoTitle">Data Verification</h3> <p>For verification purposes, please provide the following information. Bill Me Later<sup>®</sup> is subject to credit approval.</p> <div id="birthdateInfoBMLField" class="birthdayField"> <div class="inputLabelHolder"> <label for="birthMonthBMLField">Birthday: <img style="" class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input tabindex="0" id="birthMonthBMLField" class="sel_field birthMonthField pseudoSelect" readonly="readonly" type="text"> <input value="" name="birthMonthBMLField" type="hidden"> <input tabindex="0" id="birthDayBMLField" class="sel_field birthDayField pseudoSelect" readonly="readonly" type="text"> <input value="" name="birthDayBMLField" type="hidden"> <input tabindex="0" id="birthYearBMLField" class="sel_field birthYearField pseudoSelect" readonly="readonly" type="text"> <input value="" name="birthYearBMLField" type="hidden"> </div> </div> <div class="inputLabelHolder bmlSSN"> <label for="SSNBMLField">Last 4 digits of your social security #: <img style="" class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input name="SSN" size="4" maxlength="4" value="" id="SSNBMLField" class="in_field" autocomplete="off" type="text"> </div> <h3 class="infoTitle">E-Sign Consent and Terms and Conditions</h3> <a href="https://www.securecheckout.billmelater.com/paycapture-content/fetch?hash=BPU23UPB&content=/bmlweb/bmlwebtnc.pdf" id="printBMLField" title="Print BML" target="_blank">(Print)</a> <p id="termsBML"> <a href="https://www.securecheckout.billmelater.com/paycapture-content/fetch?hash=BPU23UPB&content=/bmlweb/bmlwebtnc.html" title="See terms" target="_blank">See terms</a> of the Bill Me Later<sup>®</sup> payment system.</p> <p id="consentBMLField">You must read and scroll to the bottom of the E-sign consent section of the Terms and Conditions prior to checking the box below.</p> <div id="agreeHolderBMLField" class="inputLabelHolder"> <p class="checkField"> <input id="agreeBMLField" name="agree" value="yes" type="checkbox"> <label style="" id="agreeBMLFieldLabel" for="agreeBMLField">I agree to have the <a href="https://www.securecheckout.billmelater.com/paycapture-content/fetch?hash=BPU23UPB&content=/bmlweb/bmlwebtnc.html" title="Terms and Conditions" target="_blank">Terms and Conditions</a> presented electronically.</label> </p> <input id="scrollCheck" name="scrollCheck" value="false" type="hidden"> <p class="checkField"> <input id="agreeTsBMLField" name="agreeTs" value="yes" type="checkbox"> <label id="agreeTsBMLFieldLabel" for="agreeTsBMLField">I agree to the Bill Me Later<sup>®</sup> <a href="https://www.securecheckout.billmelater.com/paycapture-content/fetch?hash=BPU23UPB&content=/bmlweb/bmlwebtnc.html" title="Terms and Conditions" target="_blank">Terms and Conditions</a>.</label> </p> </div> </div> </div> </div> </div> <div class="marketing_callout"> <span>Credit Cards</span> <p class="marketing_head_liner">Don't forget to use your AE, aerie, or 77kids credit card</p> <p>Get <em>Extra Savings</em> and special offers.</p> <div class="clearer"> </div> </div> </div> </div> </div> <input name="countryType" value="" disabled="disabled" type="hidden"> <input name="_D:countryType" value=" " type="hidden"> <input name="country" value="" disabled="disabled" type="hidden"> <input name="_D:country" value=" " type="hidden"> <input name="firstName" value="" disabled="disabled" type="hidden"> <input name="_D:firstName" value=" " type="hidden"> <input name="lastName" value="" disabled="disabled" type="hidden"> <input name="_D:lastName" value=" " type="hidden"> <input name="address1" value="" disabled="disabled" type="hidden"> <input name="_D:address1" value=" " type="hidden"> <input name="address2" value="" disabled="disabled" type="hidden"> <input name="_D:address2" value=" " type="hidden"> <input name="city" value="" disabled="disabled" type="hidden"> <input name="_D:city" value=" " type="hidden"> <input name="state" value="" disabled="disabled" type="hidden"> <input name="_D:state" value=" " type="hidden"> <input name="zip" value="" disabled="disabled" type="hidden"> <input name="_D:zip" value=" " type="hidden"> <input name="email" value="" disabled="disabled" type="hidden"> <input name="_D:email" value=" " type="hidden"> <input name="confirmEmail" value="" disabled="disabled" type="hidden"> <input name="_D:confirmEmail" value=" " type="hidden"> <input name="billingPhone" value="" disabled="disabled" type="hidden"> <input name="_D:billingPhone" value=" " type="hidden"> <input name="existingCC" value="" disabled="disabled" type="hidden"> <input name="_D:existingCC" value=" " type="hidden"> <input name="birthDayBillAddField" value="" disabled="disabled" type="hidden"> <input name="_D:birthDayBillAddField" value=" " type="hidden"> <input name="birthMonthBillAddField" value="" disabled="disabled" type="hidden"> <input name="_D:birthMonthBillAddField" value=" " type="hidden"> <input name="birthYearBillAddField" value="" disabled="disabled" type="hidden"> <input name="_D:birthYearBillAddField" value=" " type="hidden"> <input name="createLoyaltyAccount" value="false" disabled="disabled" type="hidden"> <input name="_D:createLoyaltyAccount" value=" " type="hidden"> <input name="mobileNumber" value="" disabled="disabled" type="hidden"> <input name="_D:mobileNumber" value=" " type="hidden"> <input name="baseBrand" value="" disabled="disabled" type="hidden"> <input name="_D:baseBrand" value=" " type="hidden"> <input name="loyaltyTerms" value="" disabled="disabled" type="hidden"> <input name="_D:loyaltyTerms" value=" " type="hidden"> <input name="aeAccount" value="false" disabled="disabled" type="hidden"> <input name="_D:aeAccount" value=" " type="hidden"> <input name="aeAccountPass" value="" disabled="disabled" type="hidden"> <input name="_D:aeAccountPass" value=" " type="hidden"> <input name="aeAccountPassConfirm" value="" disabled="disabled" type="hidden"> <input name="_D:aeAccountPassConfirm" value=" " type="hidden"> <input name="aeEmail" value="false" disabled="disabled" type="hidden"> <input name="_D:aeEmail" value=" " type="hidden"> <input name="aerieEmail" value="false" disabled="disabled" type="hidden"> <input name="_D:aerieEmail" value=" " type="hidden"> <input name="kidsEmail" value="false" disabled="disabled" type="hidden"> <input name="_D:kidsEmail" value=" " type="hidden"> <input name="mandoEmail" value="false" disabled="disabled" type="hidden"> <input name="_D:mandoEmail" value=" " type="hidden"> <input name="/atg/commerce/order/checkout/AeoCreatePaymentGroupFormHandler.applyPaymentGroupsSuccessURL" value="https://www.ae.com/web/checkout/checkout.jsp" type="hidden"> <input name="_D:/atg/commerce/order/checkout/AeoCreatePaymentGroupFormHandler.applyPaymentGroupsSuccessURL" value=" " type="hidden"> <input name="/atg/commerce/order/checkout/AeoCreatePaymentGroupFormHandler.applyPaymentGroupsErrorURL" value="https://www.ae.com/web/checkout/checkout.jsp" type="hidden"> <input name="_D:/atg/commerce/order/checkout/AeoCreatePaymentGroupFormHandler.applyPaymentGroupsErrorURL" value=" " type="hidden"> <input name="ajaxSuccess" value="/checkout/checkout_htmljax.jsp" type="hidden"> <input name="_D:ajaxSuccess" value=" " type="hidden"> <input name="ajaxError" value="/checkout/checkout_htmljax.jsp" type="hidden"> <input name="_D:ajaxError" value=" " type="hidden"> <input name="accessPassNumber" value="" disabled="disabled" type="hidden"> <input name="_D:accessPassNumber" value=" " type="hidden"> <div id="billingAddressFields"> <div class="checkoutFieldsetHolder"> <div class="checkoutBlock fieldset_bg" id="countryTypeBoxBillAddField" style="display: none;"> <h3 class="uppercase">Billing Country Type</h3> <div class="inputLabelHolder fullField"> <label for="countryTypeBillAddField">Country Type</label> <input tabindex="0" id="countryTypeBillAddField" class="sel_field pseudoSelect" readonly="readonly" type="text"> <input value="usa" name="countryType" type="hidden"> </div> </div> </div> <div class="checkoutFieldsetHolder"> <div class="checkoutBlock fieldset_bg" id="notCountryTypeBoxBillAddField"> <h3 class="infoTitle">Billing Address</h3> <div id="billingSameAsShip"> <div id="billingSameAsShipComplete"> <div class="stepOutputHolder"> <p class="largeBold"> <span id="firstNameBillAddFieldOutput"> </span> <span id="lastNameBillAddFieldOutput"> </span> </p> <p id="streetOneBillAddFieldOutput"> </p> <p id="streetTwoBillAddFieldOutput"> </p> <p> <span id="cityBillAddFieldOutput"> </span>, <span id="stateBillAddFieldOutput"> </span> <span id="zipBillAddFieldOutput"> </span> </p> <p id="countryOutput"> United States </p> </div> </div> <div id="editBillSameAsShip"> <div class="stepOutputHolder"> <a class="sm_bttn">Edit</a> </div> </div> </div> <div id="standardBillingForm"> <p>For your protection, this information must match the information that appears on your credit card or bank statement.</p> <div class="inputLabelHolder checkField fullField"> <input name="billSameAsShip" id="billSameAsShipBillAddField" value="yes" class="" type="checkbox"> <label for="billSameAsShipBillAddField" class="uppercase underline">My Billing & Shipping addresses are the same</label> </div> <div class="inputLabelHolder fullField"> <label for="countryBillAddField">Country, APO/FPO</label> <input tabindex="0" id="countryBillAddField" class="sel_field pseudoSelect" readonly="readonly" type="text"> <input value="US" name="country" type="hidden"> </div> <div class="inputLabelHolder"> <label for="firstNameBillAddField">First Name</label> <input name="firstName" value="" id="firstNameBillAddField" class="in_field nameField" maxlength="12" type="text"> </div> <div class="inputLabelHolderLast"> <label for="lastNameBillAddField">Last Name</label> <input name="lastName" value="" id="lastNameBillAddField" class="in_field nameField" maxlength="15" type="text"> </div> <div class="inputLabelHolderLast"> <label for="address1BillAddField">Address</label> <input name="address1" value="" id="address1BillAddField" class="in_field addressField" maxlength="30" type="text"> <input name="address2" value="" id="address2BillAddField" class="in_field addressField" maxlength="30" type="text"> </div> <div id="cityStateBillAddFieldHolder"> <div class="inputLabelHolder"> <label for="cityBillAddField">City</label> <input name="city" value="" id="cityBillAddField" class="in_field cityField" maxlength="20" type="text"> </div> <div class="inputLabelHolder"> <label for="stateBillAddField">State</label> <input tabindex="0" id="stateBillAddField" class="sel_field stateField pseudoSelect" readonly="readonly" type="text"> <input value="" name="state" type="hidden"> </div> <div class="inputLabelHolderLast"> <label for="zipBillAddField">Zip</label> <input name="zip" value="" id="zipBillAddField" class="in_field zipField" maxlength="9" type="text"> </div> </div> </div> </div> </div> </div> <div id="contactInfoFields"> <div class="checkoutFieldsetHolder "> <div class="checkoutBlock fieldset_bg"> <h3 class="infoTitle">Contact Info</h3> <div class="compareCheckHolder"> <div class="inputLabelHolder"> <label for="email">Email <img style="" class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input name="email" value="" id="emailBillAddField" class="in_field emailField" type="email"> </div> <div class="inputLabelHolderLast"> <label for="emailConfirm">Re-Type Email</label> <input name="confirmEmail" value="" id="confirmEmailBillAddField" class="in_field emailField" type="email"> </div> <span id="emailCompareCheck" class="compareCheck">✓</span> </div> <div class="inputLabelHolder"> <label for="billingPhone">Billing Phone Number <img style="" class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input name="billingPhone" value="" id="billingPhoneBillAddField" class="in_field phoneField" maxlength="17" type="text"> </div> </div> </div> </div> <div id="aerewardProgram" class="checkoutFieldsetHolder"> <div class="checkoutBlock fieldset_bg"> <h3 class="infoTitle">Get AEREWARD$ for your purchase <span class="optional">(optional)</span> </h3> <div class="inputLabelHolder"> <label for="accessPassNumber">My AEREWARD$ # <img class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input name="accessPassNumber" value="" id="accessPassNumber" class="in_field" type="text"> </div> <div class="inputLabelHolder inputCreateAcct"> <input name="aeRewardsSignUp" id="aeRewardsSignUp" class="checkoutCheckbox" maxlength="19" value="true" type="checkbox"> <div class="checkboxLabelField"> <label for="aeRewardsSignUp">Sign up now and receive 25 points just for signing up!</label> <br> <a class="jsAerewardsLink checkout_link" href="/web/modals/etcetera.jsp?name=aerewards">Learn More</a> </div> </div> <div class="inputLabelHolderLast mobilInfo"> <label class="sm_label" for="mobileNumber">Mobile Phone Number *</label> <input name="mobileNumber" value="" id="mobileNumRewardsUnlinked" class="in_field mobileNumField" maxlength="10" type="tel"> <p>* By entering your mobile number you are subscribing to receive AE text message promotions and alerts from short code 32453. Four (4) messages/month. Message and data rates may apply. <strong>Reply "HELP" for help or "STOP" to cancel to 32453.</strong> <a href="http://www.ae.com/web/help/privacy_policy.jsp?topic=1" class="checkout_link" target="_blank" title="Privacy Policy">Privacy Policy</a> | <a href="http://www.m3mobile.com/aeo/tc.htm" class="checkout_link checkout_mlink" target="_blank" title="Terms and Conditions">Terms & Conditions</a> | <a href="http://www.m3mobile.com/aeo/faq.htm" class="checkout_link checkout_mlink" title="FAQ" target="_blank">FAQ</a> </p> </div> <div class="clearer"> </div> </div> </div> <div id="createAccountHolder" class="checkoutFieldsetHolder"> <div class="checkoutBlock fieldset_bg"> <div id="createNewAccountHeader"> <h3 class="infoTitle" id="acctTitle">Create an AE account for a faster checkout <span class="optional">(optional)</span> </h3> <h3 class="infoTitle" id="acctRewardTitle">Get AEREWARD$ for your purchase <span class="optional">(optional)</span> </h3> <div id="createAccountField" class="inputLabelHolder checkField"> <input name="aeAccount" id="aeAccount" maxlength="19" value="true" type="checkbox"> <label for="aeAccount" class="plain" id="accountLabel">Create my AE Account. <img class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <label for="aeAccount" class="plain" id="accountRewardLabel">Sign up now and receive 25 points just for signing up! <a class="jsAerewardsLink checkout_link" href="/web/modals/etcetera.jsp?name=aerewards">Learn More</a> </label> </div> </div> <input value="false" name="createLoyaltyAccount" id="createLoyaltyAccount" type="hidden"> <div id="aeAccountFields"> <div class="aeRewardsFields"> <img src="/Images/global/myaccount/aerewards/create_account_card.png" alt="AEREWARD$ One card. Two Brands. Endless Rewards." height="71" width="285"> <input id="aeoBrandCard" name="baseBrand" value="00" type="hidden"> <br> <p class="clearer">To sign up, please create an AE account.</p> </div> <div class="compareCheckHolder"> <div class="inputLabelHolder"> <label for="aeAccountPass">Password (6-15 Letters & Numbers)</label> <input name="aeAccountPass" id="aeAccountPass" class="in_field passwordField" maxlength="15" type="password"> </div> <div class="inputLabelHolder"> <label for="aeAccountPassConfirm">Confirm Password</label> <input name="aeAccountPassConfirm" id="aeAccountPassConfirm" class="in_field passwordField" maxlength="15" type="password"> </div> <span id="passwordCompareCheck" class="compareCheck">✓</span> </div> <div id="birthdateInfoBillAddField" class="birthdayField"> <div class="inputLabelHolder"> <label for="birthMonthBillAddField">Birthday: <img style="" class="aeHelpIcon" src="https://www.ae.com/Images/captainCheckout/btns/help_btn.gif" alt="help"> </label> <input tabindex="0" id="birthMonthBillAddField" class="sel_field birthMonthField pseudoSelect" readonly="readonly" type="text"> <input value="" name="birthMonthBillAddField" type="hidden"> <input tabindex="0" id="birthDayBillAddField" class="sel_field birthDayField pseudoSelect" readonly="readonly" type="text"> <input value="" name="birthDayBillAddField" type="hidden"> <input tabindex="0" id="birthYearBillAddField" class="sel_field birthYearField pseudoSelect" readonly="readonly" type="text"> <input value="" name="birthYearBillAddField" type="hidden"> </div> </div> <div id="rewardsMobile" class="inputLabelHolderLast mobilInfo"> <label class="sm_label" for="mobileNumber">Mobile Phone Number *</label> <input name="mobileNumber" value="" id="mobileNumRewardsLinked" class="in_field mobileNumField" maxlength="10" type="tel"> <p>* By entering your mobile number you are subscribing to receive AE text message promotions and alerts from short code 32453. Four (4) messages/month. Message and data rates may apply. <strong>Reply "HELP" for help or "STOP" to cancel to 32453.</strong> <a href="http://www.ae.com/web/help/privacy_policy.jsp?topic=1" class="checkout_link" target="_blank" title="Privacy Policy">Privacy Policy</a> | <a href="http://www.m3mobile.com/aeo/tc.htm" class="checkout_link checkout_mlink" target="_blank" title="Terms and Conditions">Terms & Conditions</a> | <a href="http://www.m3mobile.com/aeo/faq.htm" class="checkout_link checkout_mlink" title="FAQ" target="_blank">FAQ</a> </p> </div> <div id="mailingSignup"> <p class="emailAcctText">I would like to receive emails and special offers from the following brands of American Eagle Outfitters, Inc. <a href="/web/help/privacy_policy.jsp?topic=1" class="checkout_link" target="_blank">Privacy Policy</a> </p> <div class="inputLabelHolder checkField"> <input name="aeEmail" id="aeEmail" checked="checked" type="checkbox"> <label for="aeEmail" class="plain">AE</label> </div> <div class="inputLabelHolder checkField"> <input name="aerieEmail" id="aerieEmail" checked="checked" type="checkbox"> <label for="aerieEmail" class="plain">aerie</label> </div> </div> <div class="clearer"> </div> <div class="inputLabelHolder aeRewardsFields checkField"> <input name="loyaltyTerms" id="loyaltyTerms" value="" type="checkbox"> <label for="loyaltyTerms" class="plain">I accept the <a href="/web/help/aerewards.jsp?topic=4" class="checkout_link" target="_blank">Terms & Conditions</a> </label> </div> </div> </div> </div> <div class="stepSubmitPadding"> <input id="billingFormSubmit" name="submit" value="▸ Next Step" class="nextStepbtn strong_bttn js_submitForm" type="submit"> <input name="_D:submit" value=" " type="hidden"> </div> ...
organization info input
foursquare
- http://playfoursquare.com/ - when creating a new venue: http://playfoursquare.com/add_venue
Input form markup simplified a bit with presentational markup removed, whitespace added for readability:
<form action="/add_venue" method="POST"> <table cellpadding="3" cellspacing="0" border="0" class="text"> <tr><td>Name: </td> <td><input type="text" name="venuename" value=""></td> </tr> <tr><td>Address: </td> <td><input type="text" name="address" value=""></td> </tr> <tr><td>Cross Street: </td> <td><input type="text" name="crossstreet" value=""> <span class="text_mini"> (Not sure, check <a target="_new" href="http://maps.google.com"> Google Maps</a>. Then add like this: "at 5th Ave", "btw Essex & Rivington", "btw 3rd and 4th") </td> </tr> <tr><td>City, State, Zip: </td> <td><input type="text" name="city" value="San Francisco"> <input type="text" name="state" value="CA">, <input type="text" name="zip" value=""></td> </tr> <tr><td>Phone: </td> <td><input type="text" name="phone" value=""></td> </tr> <tr><td>In... </td> <td><select name="cityid"> <option value="56">Amsterdam <option value="46">Atlanta <option value="42">Austin <option value="24">Boston <option value="32">Chicago <option value="43">Dallas / Fort Worth <option value="25">Denver <option value="47">Detroit <option value="48">Houston <option value="49">Las Vegas <option value="34">Los Angeles <option value="39">Miami <option value="51">Minneapolis / St. Paul <option value="22">New York City <option value="33">Philadelphia <option value="53">Phoenix <option value="37">Portland <option value="38">San Diego <option value="23" selected>San Francisco <option value="41">Seattle <option value="31">Washington, DC </select> </td> </tr> <tr><td> </td> <td><input type="hidden" name="task" value="add"><br> <input type="submit" name="submit" value="Add venue" class="input_button"> </td> </tr> </table> </form>
Upcoming
- http://upcoming.org/ - when creating a new venue as part of creating a new event http://upcoming.org/event/add/
Input form markup simplified a bit with much presentational markup removed, whitespace added for readability:
<form id="venueForm"> <input type="hidden" name="mode" value="add" /> <table> <tr><td class="fieldName required">Venue name</td> <td><input id="venueForm.name" class="longwidth" type="text" name="name" value=""/></td> </tr> <tr><td class="fieldName required">Address</td> <td><input id="venueForm.address" class="longwidth" type="text" name="address" value=""/></td> </tr> <tr><td class="fieldName required">City</td> <td><input id="venueForm.city" type="text" class="shortwidth" name="city" value="San Francisco"/> <span id="city_locality"></span> </td> </tr> <tr id="venueForm.stateControl"> <td class="fieldName required" id="venueForm.stateFieldName">State</td> <td id="venueForm.stateFieldSelect"> <select id="venueForm.state_id" name="state_id" class="shortwidth"> <option value="">Select one:</option> <option value="VrrjuESbApjeFS4.">Alabama</option> <option value="EGmcViGbApjaOAIx">Alaska</option> <option value="aMpCyxWbApibkpqW">Arizona</option> <option value="7xRVzoqbApiHDeUo">Arkansas</option> <option value="SVrAMtCbAphCLAtP" selected="selected">California</option> <option value="MKJHB.WbApho1rUk">Colorado</option> <option value="FkxA9BebApjYEct2">Connecticut</option> <option value="9lnLQaubAph4CBFY">Delaware</option> <option value="hEO_NTibApj.GarA">District of Columbia</option> <option value="X2rdBEmbAphlKYoq">Florida</option> <option value="SfUOhpybApgiOUqd">Georgia</option> <option value="hJJxLmabApiLFHxu">Hawaii</option> <option value="VjF8qh6bApgg1NEP">Idaho</option> <option value="ep0T8vebApgnVGQJ">Illinois</option> <option value="6ZUu6dSbAphlUwuQ">Indiana</option> <option value="z0YqJVWbApjKiSnP">Iowa</option> <option value="oWJeqYybApiY0W5o">Kansas</option> <option value="iK5lPHCbApgEgL2g">Kentucky</option> <option value="VJHA.cubApgwcs4j">Louisiana</option> <option value="ixFYT4KbApjgio6l">Maine</option> <option value=".lxt4uObApj2NsBW">Maryland</option> <option value="hTJZWCCbApjOtQtE">Massachusetts</option> <option value="IS02152bAphBVbXh">Michigan</option> <option value="4p3FSLibApjuko1f">Minnesota</option> <option value="lo49c0qbApjMM6Zl">Mississippi</option> <option value="0y2li7qbApg.ucH1">Missouri</option> <option value="PUAsXQubApif9uxp">Montana</option> <option value="TWcSbO2bApixYeYW">Nebraska</option> <option value="kB09AqebApi0LC1C">Nevada</option> <option value="ccBppK2bAphDyDdD">New Hampshire</option> <option value="4siKkMybApicLFcV">New Jersey</option> <option value="nVGNdS6bApiTnTVD">New Mexico</option> <option value="R63H06ibApjqiWyL">New York</option> <option value="ouArr2CbAphmLPif">North Carolina</option> <option value="mRIcwCybApgZ9OLE">North Dakota</option> <option value="LtkqzVqbApjAbJxv">Ohio</option> <option value="L9NuIHqbApg9_5WE">Oklahoma</option> <option value="4vvLDQabApjbhCKB">Oregon</option> <option value="A_iJ8aibApiqrHrE">Pennsylvania</option> <option value="r_aB4QObApiRFE0s">Rhode Island</option> <option value="WNAy5LmbApgBn3np">South Carolina</option> <option value="KtbP0w.bAph.qbDW">South Dakota</option> <option value="QZ9P1cibApj2OGLJ">Tennessee</option> <option value="b1Yi6qubApjz6jWW">Texas</option> <option value="dRP0NVGbApgp2ig.">Utah</option> <option value="oMgj1Q.bAphUWSGp">Vermont</option> <option value="22b1cJWbApjzghQy">Virginia</option> <option value="8LwX6FSbApgD.7YC">Washington</option> <option value="HrjecOWbApilONRg">West Virginia</option> <option value="olxEVY.bApgALAoK">Wisconsin</option> <option value="GKBBst6bApgMUjLT">Wyoming</option> </select> </td> </tr> <tr><td class="fieldName optional">Postal/ZIP code</td> <td><input id="venueForm.zip" type="text" name="zip" value="" maxlength="20" /></td> </tr> <tr><td class="fieldName required">Location</td> <td> <select id="venueForm.country_id" name="country_id" class="shortwidth"> <option value="">Select a location:</option> <option value="99j0L66bApj3ieAJnA--"> </option> <option value="mk7pmhqbApgNkF9cxQ--">Afghanistan</option> <option value="93On3wqYA5nlcPOg_g--">Aland Islands</option> <option value="5vfTLnubApiLBhNR.w--">Albania</option> <option value="ORyW1j2bApgE.0qQ1w--">Algeria</option> <option value="Zs9tDlybApiQpHY_Dw--">Andorra</option> <option value="0_VzNnObApiBuCV4.Q--">Angola</option> <option value="air5DJGbApiDaxRFqw--">Anguilla</option> <option value="1ANQpIebCZ5PZzsFvw--">Antarctica</option> <option value="RBw1Mu2bAphpl9xRRw--">Antigua & Barbuda</option> <option value="6W4_JdubAphR0wHLfQ--">Argentina</option> <option value="02C6Lc.bAphot7JqUg--">Armenia</option> <option value="h03BNNubApigEfCGrA--">Aruba</option> <option value="om3Zr2abAphqrm3jdA--">Australia</option> <option value="0rwtp2CbApivsyK_vg--">Austria</option> <option value="C.FaCZabAphsmzy5ZQ--">Azerbaijan</option> <option value="XM2m9IubApjhngMjTw--">Bahamas</option> <option value="JdXAX2KbApjExcA27Q--">Bahrain</option> <option value="bs.gdkibAphIoXLofA--">Bangladesh</option> <option value="n7rOIBSbApiRLRkm.A--">Barbados</option> <option value="ZSq41q.bApiEwz0LAg--">Belarus</option> <option value="V5Bv0yebAph.v7zRHQ--">Belgium</option> <option value="5wFG4vSbApgmrg8KSQ--">Belize</option> <option value="xbugkTabApgvllxe2g--">Benin</option> <option value="F6imz.KbApj2gKYUog--">Bermuda</option> <option value="OMJtMoObApiRaiy.ng--">Bhutan</option> <option value="W9p9WrubApgW2PD9CA--">Bolivia</option> <option value="H_Q_X6ObApjiAEsAng--">Bosnia and Herzegovina</option> <option value="F4AhWUybAphJFMk0Ug--">Botswana</option> <option value="STgdNFebCZ4MxImwuw--">Bouvet Island</option> <option value="upv8IF2bAphU2TQWUg--">Brazil</option> <option value="hwmWntebApg7frl_pg--">British Indian Ocean Territory</option> <option value="PvjeYGybApjIyoaWrQ--">Brunei</option> <option value="J8M70dGbApgS6xLIFw--">Bulgaria</option> <option value="qlfX7bqbAphcq7090g--">Burkina Faso</option> <option value="eqpW3dWbAphM_7Kfrw--">Burundi</option> <option value="PofUD3WbAphrc6gXCg--">Cambodia</option> <option value="PAHftWWbApgiXJSV0g--">Cameroon</option> <option value="EESRy8qbApgaeIkbsA--">Canada</option> <option value="XmagXgGbAph1Sq5.7w--">Cape Verde</option> <option value="5C1tIfibApi8xnV5PA--">Cayman Islands</option> <option value="9do_6MebApiKmpjaaw--">Central African Rep</option> <option value="rW3W6XubAph1h5qU5A--">Chad</option> <option value="aWTaf8KbApg_rhXSIw--">Chile</option> <option value="T.Hkt2ObApgpie.ozQ--">China</option> <option value="7Kf1XjGbAphpCBdyZA--">Christmas Island</option> <option value="V4ioOo6bApjfrDztDg--">Cocos (Keeling) Islands</option> <option value="sIxHQmubApjpQKqFZw--">Colombia</option> <option value="Zr3xudybAphyN.T2Tg--">Comoros</option> <option value="52QT_bqbApjFEe3Few--">Congo</option> <option value="ICrDU2ObApi1wEHYag--">Cook Islands</option> <option value="GGuH8nabApi3E_piFA--">Costa Rica</option> <option value="l3qgsFqbApiZ8tehVw--">Cote d'Ivoire</option> <option value="aXXFY66bApjxD_pAnA--">Croatia</option> <option value="LgXPpuObApjiHycxIA--">Cuba</option> <option value="a8lDDD6bB5SdIb2xbg--">Cyprus</option> <option value="mb7vmlObApj0EX3VpA--">Czech Republic</option> <option value="vKseDrebApj6WaqXyQ--">Denmark</option> <option value="_Bz0w.ebApg2UDJ_IQ--">Djibouti</option> <option value="8s622CybApiVx.90Jg--">Dominica</option> <option value="l3C6r0WbAphufkWC3Q--">Dominican Republic</option> <option value="ufLVLH6bAphVeziG0g--">East Timor</option> <option value="DKCe25ubAph.RhNDdA--">Ecuador</option> <option value="Pu5_HsObApilq4vUtQ--">Egypt</option> <option value="wg1mHHubApiMpkYz3g--">El Salvador</option> <option value="JvTMIFubApjqSiQeCw--">Equatorial Guinea</option> <option value="RhHr7dabApjqd5Tdxw--">Eritrea</option> <option value="TUibXW2bAphY.fKQLw--">Estonia</option> <option value="adtSGRKbApizQ8GeVA--">Ethiopia</option> <option value="JRsg3SabAphwNOF8jQ--">Falkland Islands</option> <option value="JRYCbmybApgJ.a5U0w--">Faroe Islands</option> <option value="z4KjFz.bApirM6lO.Q--">Fiji</option> <option value="mSCQNWWbAphdLH6WDQ--">Finland</option> <option value="6immEPubAphfvM5R0g--">France</option> <option value="4k5sWY.bAphidHAvcQ--">French Guiana</option> <option value="gIb3R5CbAphWNsY4kw--">French Polynesia</option> <option value="c5unhWebApiRc1KLVA--">Gabon</option> <option value="PR2M2RibApjBqrMTTw--">Gambia</option> <option value="RmtfJUebApi3y0ZLCg--">Georgia</option> <option value=".CuNPxmbApgQChfYbQ--">Germany</option> <option value="AMCzGkqbApgwZCTi5w--">Ghana</option> <option value="NP_GbgCbApjCLTWAhg--">Gibraltar</option> <option value="zM5Y.8KbApibMHBs6g--">Greece</option> <option value="aPYw1F2bApg1dnrjrQ--">Greenland</option> <option value="IwK4EZibAph2ooHg9g--">Grenada</option> <option value="pSYtXBebAphLFzrUAQ--">Guadeloupe</option> <option value="HxUewXebApi7ODh1jg--">Guam</option> <option value="Vfrmd7qbAphGjGnabQ--">Guatemala</option> <option value="dtPTX06bApghIGXe8Q--">Guinea</option> <option value="191Y.5ObApihzoxtCw--">Guinea-Bissau</option> <option value="cdRwH_qbApg0UYtUuA--">Guyana</option> <option value="ftb3taCbAphc1LvXlw--">Haiti</option> <option value="2Dzxkp.bApg2oDSwSw--">Honduras</option> <option value="nwT2nyWbBZTnoYEf1w--">Hong Kong</option> <option value="JV78LJabApggXHWAVg--">Hungary</option> <option value="82XvRyWbApiBdYUVcg--">Iceland</option> <option value="7gGxOnGbApgQ3.2i2g--">India</option> <option value="PgohIQSbApi499P62w--">Indonesia</option> <option value="hj5CUgmbAphQv4QraQ--">Iran</option> <option value="gsz9goybApiUhrfYWQ--">Iraq</option> <option value="NgWwDdibApjORH9Dzg--">Ireland</option> <option value="ktwvIm6bApiHRCYuCw--">Israel</option> <option value="mpa01jWbAphICsyCsA--">Italy</option> <option value="ffXSwFabApiK1MiqQw--">Jamaica</option> <option value="JOgKHwabApgvrbIuBA--">Japan</option> <option value="t1nzQlabApislO4_Ng--">Jordan</option> <option value="pVRDy0CbApiUFdo1Cw--">Kazakhstan</option> <option value="beQahHabAph9YX72Bg--">Kenya</option> <option value="pfKWbqCbApjj2aWt.g--">Kiribati</option> <option value="WE.KMIibAph4wnAotg--">Kuwait</option> <option value="1hkNzRGbAphM9YmatA--">Kyrgyzstan</option> <option value=".4mH_JKbApj9R1THMg--">Laos</option> <option value="b4k0DgibApgJUMzQNQ--">Latvia</option> <option value="KqieB9ibApgOVlou.g--">Lebanon</option> <option value="2WX8N06bApjNMPIr3g--">Lesotho</option> <option value="wJNrqOGbAphoYTggvw--">Liberia</option> <option value="fjfChhqbAph4Po9qnQ--">Libya</option> <option value="JBZl0uubApj47dn5nA--">Liechtenstein</option> <option value="RvoJCNybApgZwAXUdw--">Lithuania</option> <option value="SRJMfbGbApgmaXaCHw--">Luxembourg</option> <option value="WRA46habAZwNB2KPvA--">Macau</option> <option value="KorxKmubApj5tgGqIw--">Macedonia</option> <option value="uOAlq5ybApg5JWDr2g--">Madagascar</option> <option value="7TMi8ZKbApiRqCOF9g--">Malawi</option> <option value="Szh8wXObApjtkb7uRg--">Malaysia</option> <option value="kgkcaxSbAphjbHPODQ--">Maldives</option> <option value="Kckuqs.bApgn52ySOA--">Mali</option> <option value="Ju2IetqbApgVybuIIw--">Malta</option> <option value=".YSmwFCbAph2qpKcww--">Marshall Islands</option> <option value="9W208P2bApicb3oGQQ--">Martinique</option> <option value="fh5QIxKbApgRINgIWw--">Mauritania</option> <option value="BKI.R3WbApiaydihVw--">Mauritius</option> <option value="2mr2Xg.bApgJRrrorg--">Mayotte</option> <option value="NHPFyi2bApioBMz4qQ--">Mexico</option> <option value="2FT9ReSbApjX7a2B7g--">Micronesia</option> <option value="lqgmluqbAphfVIeWgw--">Moldova</option> <option value="QBLLXwmbApgjE7501A--">Monaco</option> <option value="y8JIDwmbApiGDBUEog--">Mongolia</option> <option value="oeC00PqbApjswgZGzQ--">Montserrat</option> <option value="PksYt6GbApjZnqbeog--">Morocco</option> <option value="1CtYQ7mbApjXFUoh.g--">Mozambique</option> <option value=".Xjm7iCbApi7b57ibg--">Myanmar</option> <option value="KQOUNmKbApgBnYy5KQ--">Namibia</option> <option value="EE02tV6bApgf.goqxg--">Nauru</option> <option value="40CSPnmbApi1Lz.guQ--">Nepal</option> <option value="bIrkmoqbApgSFKQkbA--">Netherlands</option> <option value="O9KQtTGbApiSCtcpiQ--">Netherlands Antilles</option> <option value="9TK1dFqbApgwS0BpCQ--">New Caledonia</option> <option value="IGGna0WbApjrTG64MQ--">New Zealand</option> <option value="VP_M67ybApg23k8JxA--">Nicaragua</option> <option value="xjMTDWebApjKuhXX2w--">Niger</option> <option value="RAanp1SbAphrfiOjnQ--">Nigeria</option> <option value="A56KC8ubApizM.foJA--">Niue</option> <option value="AeQ._5KbAphKdIz7kQ--">Norfolk Island</option> <option value="z31zW9abApgsbvbFEQ--">Northern Mariana Islands</option> <option value="hJOTe52bAphxGEaUNA--">Norway</option> <option value="eHAbyCmbApjTqPR6wg--">Oman</option> <option value="YMVhl7qbApiGiV5K7g--">Pakistan</option> <option value="AADt9VybApif8MoHHA--">Palau</option> <option value="JB8DH62bCZ56qA5neg--">Palestine</option> <option value="aHbYEyObAphH9RopeA--">Panama</option> <option value="HTk5xEybApjTNVOy5g--">Papua New Guinea</option> <option value="I84gLkmbApjYB.8cEQ--">Paraguay</option> <option value=".AImfuqbAphP1VCCRA--">Peru</option> <option value="3wLNHKCbApioSrAs.A--">Philippines</option> <option value="4hKSLdibApiuV9HnXA--">Pitcairn</option> <option value="0kV97TybAphIxvm14g--">Poland</option> <option value="Tk1TTfSbAphr_X8ZQQ--">Portugal</option> <option value="XwiDSL.bAph1f_koJg--">Puerto Rico</option> <option value="_8vj8o.bApiVMJeJ6A--">Qatar</option> <option value="33mz8N2bApjWpg2ENA--">Reunion</option> <option value="gIKzNP2bApgChOkbMw--">Romania</option> <option value="_18eXJWbApiQJFogjg--">Russia</option> <option value="XDAzAjGbApjNAoO62Q--">Rwanda</option> <option value="AVNwdECbAphhjZMHfA--">Saint Lucia</option> <option value="t.upO4ObAph549Fkqg--">Samoa American</option> <option value="mCrU3SybApirEffyaw--">Samoa Western</option> <option value="FcPfV9qbApi2_odvow--">San Marino</option> <option value="Dd9nWmqbAphsplI0Gw--">Sao Tome & Principe</option> <option value="9y6.AxebAphKDEN_hg--">Saudi Arabia</option> <option value="wlenGZabApgkcvdJkQ--">Senegal</option> <option value="WvL7VOabAph2kI4rYQ--">Serbia and Montenegro</option> <option value="UNQMbqGbApiCY2VSRw--">Seychelles</option> <option value="pIZ6R.ObApgvI5Ppww--">Sierra Leone</option> <option value="I5nu9NCbApiYXGcS7A--">Singapore</option> <option value="FoI2iJKbAph_Wp9MYQ--">Slovakia</option> <option value="u4BHPT.bApjdmD9O0g--">Slovenia</option> <option value="jmQWCBGbApggGa8usw--">Solomon Islands</option> <option value="8Gyen6abAphUelKElw--">Somalia</option> <option value="gN1gp86bAphaqw7f8A--">South Africa</option> <option value="yOH.Bu.bAphO1VO.Ug--">South Korea</option> <option value="3s63vaibApjQipWazQ--">Spain</option> <option value="ZkWuNn2bAphbZV1cWA--">Sri Lanka</option> <option value="InV05VqbAphiffXy5A--">St Kitts & Nevis</option> <option value="GedQ9gSbApj5hYp0gQ--">St Vincent</option> <option value="mwmYvzWbApj7ebl7vw--">St. Helena</option> <option value="kTRJkWWbApiMuKgqmg--">St. Pierre & Miquelon</option> <option value="9yNom0ybApiMmOsh.Q--">Sudan</option> <option value="blK_TrabApgSDTuXGA--">Suriname</option> <option value="0e_SMc2bApi0DUmnKA--">Swaziland</option> <option value="5br4Zu.bApj.jCAqAw--">Sweden</option> <option value="YmiN9_ybApjeMPWXWA--">Switzerland</option> <option value="MCfUBUqbAphARLGJeg--">Syria</option> <option value="aeon25WbAph6k4cGqg--">Taiwan</option> <option value="ayxowz6bApjpio_asQ--">Tajikistan</option> <option value="HYgjo1qbApgTYknVEA--">Tanzania</option> <option value="wVzKvc6bAphUAzlxNg--">Thailand</option> <option value="Eb_XBMibApi6E.CBYA--">Togo</option> <option value="GdaPbXubApilnS.PKA--">Tokelau</option> <option value="BuwEbp.bApj4oRvR8A--">Tonga</option> <option value="pzhe7UybApildYjpQQ--">Trinidad & Tobago</option> <option value="R0Xz5ZKbApgMxoYh1w--">Tunisia</option> <option value="FjYPPTmbApi1G.RRlw--">Turkey</option> <option value="tW5NznmbApiAL5GwTw--">Turkmenistan</option> <option value="1iFqCa6bApj42p_P8w--">Turks & Caicos</option> <option value="e9kvXgybApgn8VsrYQ--">Tuvalu</option> <option value="dZhYeOWbAphhU.1P0A--">Uganda</option> <option value="zJOg_w.bApgGM39lUQ--">Ukraine</option> <option value="M_HdsZabApiDA.C.6Q--">United Arab Emirates</option> <option value="DevLebebApj4RVbtaQ--">United Kingdom</option> <option value="4KO02SibApitvSBieQ--" selected="selected">United States</option> <option value="PiiHJuibAphbasf.lQ--">Uruguay</option> <option value="wJpoo96bAph1kTne2Q--">Uzbekistan</option> <option value="CY80R5abAphhC7kHIg--">Vanuatu</option> <option value="umv5A3ubAph0.QLFHQ--">Vatican City</option> <option value="BpQAAZebApil.XeDXg--">Venezuela</option> <option value="Je31N0qbApjgWRKI7w--">Vietnam</option> <option value="1NhpyzqbApjR7kITKA--">Virgin Islands US</option> <option value="NM4VepGbApjNilNu9A--">Wallis & Futuna</option> <option value="S2pzEVmbApiVX1jfYQ--">Western Sahara</option> <option value="stkCiEabAphGFkrFLg--">Yemen</option> <option value="uD9tliCbApjjszjtVA--">Zambia</option> <option value="jCJwhnebAphHfsijqA--">Zimbabwe</option> </select> </td> </tr> <tr><td colspan="2"><span class="tblTitle">More details</span>(optional, but nice)</td> </tr> <tr><td class="fieldName optional">Phone number</td> <td><input id="venueForm.phone" type="text" name="phone" value="" class="shortwidth"/></td> </tr> <tr><td class="fieldName optional">Venue homepage</td> <td><input id="venueForm.url" type="text" name="url" value="" class="longwidth"/></td> </tr> <tr><td class="fieldName optional">Short description</td> <td><textarea class="longwidth" id="venueForm.description" name="description" rows="5" cols="50"></textarea> </td> </tr> <tr><td class="fieldName"></td> <td><input type="checkbox" name="private" value="1" id="private" /> <label for="private"> <b>Personal/private</b> (e.g. your apartment, home, or private space)</label><br /></td> </tr> <tr id="venue_submit"> <td class="fieldName"></td> <td><input id="venue_submit" type="submit" name="submit" value="Submit" class="submit" /> or <a href="#"> Close this window </a> </td> </tr> </table> </form>
Yelp add business
- http://yelp.com/ - when adding a new business: http://www.yelp.com/writeareview/newbiz
Simplified input form markup, scripting/presentational markup removed, whitespace adjusted for readability:
<form method="post" action="/writeareview/newbiz" name="review_rate_form" id="review_rate_form"> <dl id="reviewForm"> <dt><strong>Business Name</strong></dt> <dd><input maxlength=64 name="newbiz_name" id="newbiz_name" class="form300" value="" autocomplete="off"></dd> <dt><strong>Address 1</strong></dt> <dd><input maxlength=64 name="newbiz_address1" class="form300" value="" autocomplete="off"></dd> <dt><strong>Address 2</strong></dt> <dd><input maxlength=64 name="newbiz_address2" class="form300" value=""></dd> <dt><strong>City, State & Zip</strong></dt> <dd><input maxlength=64 name="newbiz_location" id="newbiz_location" class="form300" value="" autocomplete="off" ></dd> <dt><strong>Phone</strong></dt> <dd><input maxlength=32 name="newbiz_phone" class="form150" value="" autocomplete="off"></dd> <dt><strong>Web Address</strong></dt> <dd><input maxlength=255 name="newbiz_website" class="form300" value=""></dd> </dl> <div> <p class="alignright"><em class="smaller">* Please Note: it will take 48 hours for a newly added business to appear in search.</em></p> <input type="hidden" name="default_action" value="select"> <a href="/">Cancel</a> <input type="submit" name="action_select" value="Post It"> </div> </form>
Yelp add business markup challenges
- Yelp has a single input for "City, State & Zip". The challenge here is how to mark that up to express the semantic that
adr
locality
,region
, andpostal-code
should be concatenated (perhaps with a comma "," between the city and state, and a space " " between the state and the zip?) and placed into that single field.
<dt><strong>City, State & Zip</strong></dt> <dd><input maxlength=64 name="newbiz_location" id="newbiz_location" class="form300" value="" autocomplete="off"></dd>
... more organization info input examples ...
location info input
Presumably there are sites and forms where a user enters location information but not necessarily a complete venue. If it's a named location, it could benefit from copy and paste hCard support, or if it is just an address or geo coordinates, it could benefit from copy and paste adr/geo support.
Examples:
- ...
Chrome autocomplete examples
See:
And extract examples of specific sites and their input forms to document here as real world examples.