<div class="needContent">
<label for="Country" >Country</label> //ERROR
<span class="red-star">∗</span>
<input list="browsers" name="Country" required="required">
<datalist id="browsers">
<option value="Canada">
<option value="The United States">
<option value="India">
<option value="JPakistan">
<option value="Germany">
</datalist>
</div>
Error: The for attribute of the label element must refer to a non-hidden form control.
From line 96, column 6; to line 96, column 27
nt">↩ Countr
<div class="needContent">
<label for="Province" >Province</label>
<span class="red-star">∗</span>
<select name="Province" id="Province" onkeyup="starShow()"
required="required">
<option value="">Alberta</option>
<option value="">British Columbia</option>
<option value="">Manitoba</option>
<option value="">New Brunswick</option>
<option value="">Newfoundland and Labrador</option>
<option value="">Nova Scotia</option>
<option value="">Ontario</option>
<option value="">Prince Edward Island</option>
<option value="">Quebec</option>
<option value="">Saskatchewan</option>
<option value="">Northwest Territories</option>
<option value="">Nunavut</option>
<option value="">Yukon</option>
</select>
</div>
So according to my assignment I am supposed to create
Dropdown list: select element with options - the 10 provinces and 3 territories of Canada, required. The full names of provinces and territories will be showed up on the list and organized in two groups: Provinces and Territories. The values for option elements must use standard 2-letter abbreviations.
but if I put the (value ="ON") it gives me errors in HTML checker. Can someone help me fix it please?
Related
This question already has answers here:
How do I make a field required in HTML?
(16 answers)
Closed 2 months ago.
<label for="select-choice">Birthday:</label>
<select name="select-choice" id="select-choice">
<option value="0" selected disabled>Month</option>
<option value="january">Jan</option>
<option value="february">Feb</option>
<option value="march">Mar</option>
<select name="birthday-day" id="day">
<option value="0" selected disabled>Day</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<select name="birthday-year" id="year">
<option value="0" selected disabled>Year</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
The Sign Up or Register page is okay but I could not validate the birthday, When I try filling it on a browser I expect it to demand or require birthday option, every other input option was demanding or requiring me to input an information but if I purposely did not fill the birthday and hit the submit button it will go through just like that, please how do I validate the birthday using HTML?
You just need to add "required" to each of your selects and then just add an empty value instead of a "0" value. When you press a button, it will detect it has no value and will automatically make the select required.
<form>
<label for="select-choice">Birthday:</label>
<select name="select-choice" id="select-choice" required>
<option value="">Month</option>
<option value="january">Jan</option>
<option value="february">Feb</option>
<option value="march">Mar</option>
</select>
<select name="birthday-day" required>
<option value="">Day</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select name="birthday-year" id="year" required>
<option value="">Year</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
</select>
<button>submit</button>
</form>
I'm creating a sign up form as part of my assignment. The form data is getting submitted except for the province data. The provinces are in a dropdown list. I initially only had the value and thought that was the issue so I added the name and id but I'm still experiencing the same issue. What am I missing? I can't seem to figure it out. Below is my html code for the dropdown, checkboxes and radio button. I'm only using html.
<h3>Which province are you from?</h3>
<select>
<option value="easternCape" name="province" id="=ec">Eastern Cape</option>
<option value="freeState" name="province" id="fs">Free State</option>
<option value="gauteng" name="province" id="gp">Gauteng</option>
<option value="kwaZulu-Natal" name="province" id="kzn">KwaZulu-Natal</option>
<option value="limpopo" name="province" id="lim">Limpopo</option>
<option value="mpumalanga" name="province" id="mp">Mpumalanga</option>
<option value="northWest" name="province" id="nw">North West</option>
<option value="northernCape" name="province" id="nc">Northern Cape</option>
<option value="westernCape" name="province" id="wc">Western Cape</option>
</select><br>
<h3>Preferred payment method</h3>
<input type="checkbox" name="pmtMthd" value="eft">EFT<br>
<input type="checkbox" name="pmtMthd" value="cc">Credit Card<br>
<input type="checkbox" name="pmtMthd" value="ppal">Paypal<br>
<h3>Preferred delivery method</h3>
<input type="radio" name="method" value="courier">Courier<br>
<input type="radio" name="method" value="post">Post<br>
I believe the issue is that you are adding the ID and name to the options instead of the select tag itself.
<select name="province" id="province">
<option value="easternCape">Eastern Cape</option>
<option value="freeState">Free State</option>
<option value="gauteng">Gauteng</option>
<option value="kwaZulu-Natal">KwaZulu-Natal</option>
<option value="limpopo">Limpopo</option>
<option value="mpumalanga">Mpumalanga</option>
<option value="northWest">North West</option>
<option value="northernCape">Northern Cape</option>
<option value="westernCape">Western Cape</option>
</select>
When getting the form result, pull the value from the name and ID "province" and you should get the selected value. The select tag is a special "input" tag for a form, so you get the value from it instead of its options
how can I fill an online form with python (preferably with the requests library)?
On the website http://carsalesbase.com/european-car-sales-data/alfa-romeo/alfa-romeo-giulia/
there are four forms in total. Three are looking more or less identical.
I want to fill one of these three. It is a form with two dropdown menus.
<form action="http://carsalesbase.com/" class="search-form" method="get" role="search">
<input class="" id="hide-value" name="hide-value" type="hidden" value="1"/>
<select class="kelas1" id="brand-option" name="brand-option">
<option value="0">Select Brand</option>
<option value="82"> Group</option> <option value="17">Alfa Romeo</option> <option value="1">Alpina</option> <option value="249">Alpine</option> <option value="2">Aston Martin</option> <option value="67">Audi</option> <option value="68">Bentley</option> <option value="4">BMW</option> <option value="259">Borgward</option> <option value="8">Brilliance</option> <option value="69">Bugatti</option> <option value="27">Cadillac</option> <option value="75">Caterham</option> <option value="29">Chevrolet USA</option> <option value="28">Chevrolet-Daewoo</option> <option value="13">Chrysler</option> <option value="48">Citroën</option> <option value="54">Dacia</option> <option value="63">Daihatsu</option> <option value="14">Dodge</option> <option value="12">DR Motor</option> <option value="160">DS</option> <option value="18">Ferrari</option> <option value="19">Fiat</option> <option value="87">Fisker </option> <option value="24">Ford</option> <option value="33">Great Wall</option> <option value="34">Honda</option> <option value="30">Hummer</option> <option value="35">Hyundai</option> <option value="51">Infiniti</option> <option value="89">Isuzu</option> <option value="60">Jaguar</option> <option value="15">Jeep</option> <option value="36">Kia</option> <option value="3">Lada</option> <option value="70">Lamborghini</option> <option value="20">Lancia</option> <option value="23">Lancia-Chrysler</option> <option value="61">Land Rover</option> <option value="85">Landwind</option> <option value="64">Lexus</option> <option value="45">Lotus</option> <option value="83">Mahindra</option> <option value="21">Maserati</option> <option value="78">Maybach</option> <option value="40">Mazda</option> <option value="88">McLaren</option> <option value="9">Mercedes-Benz</option> <option value="41">MG</option> <option value="5">Mini</option> <option value="44">Mitsubishi</option> <option value="84">Morgan</option> <option value="52">Nissan</option> <option value="31">Opel/Vauxhall</option> <option value="47">Perodua</option> <option value="49">Peugeot</option> <option value="71">Porsche</option> <option value="46">Proton</option> <option value="91">Qoros</option> <option value="55">Renault</option> <option value="6">Rolls Royce</option> <option value="42">Rover</option> <option value="58">Saab</option> <option value="90">SAIC MG</option> <option value="72">Seat</option> <option value="73">Skoda</option> <option value="10">Smart</option> <option value="38">SSangYong</option> <option value="56">Subaru</option> <option value="57">Suzuki</option> <option value="62">Tata</option> <option value="86">Tesla</option> <option value="65">Toyota</option> <option value="74">Volkswagen</option> <option value="26">Volvo</option>
</select>
<select class="kelas1" id="model-option" name="model-option">
<option value="0">Select Model</option>
</select>
<input name="css-go" type="submit" value="Go"/>
</form>
I cannot find any good resource explaining how to do that :(
Who can help?
Thanks!
You cannot click on stuff with the requests library, but what you can do to get the data is mimic the HTTP request made after a form is submitted.
Use Chrome Network tools or Fiddler to analyze all of the requests your browser sends to the server when you submit a form. In this case, when submitting a form with the car brand as Tesla and the car model as Model X, we can see the request's method, which is of type GET, the base URL, and the required parameters.
We can use this information to simulate a webpage form submit and get the data that way:
import requests
params = {
"hide-value": 1,
"brand-option": 86,
"model-option": 2129,
"css-go": "Go"
}
html = requests.get("http://carsalesbase.com/", params=params).text
print(html)
I would use selenium, it lets you script what you would do as a user manually.
Here's a description of how to select elements on a webpage.
This answer explains how to select an option from a dropdown.
Does anyone know why a form field name would cause Chrome's autofill to stop working correctly? If you open the fiddle I've created in Chrome, you'll notice the Card Number field populates correctly, but not the expiry month and year. If you change the name of the BirthDate.MM select list to BirthDate.Foo and BirthDate.YYYY to BirthDate.Bar; and then and re-run, the credit card autofill works as expected. Now, an obvious suggestion would be to simply disable the bday- autofill and change the those values to "off" or completely remove the autocomplete attribute. Astoundingly, removing the autocomplete attribute or changing the bday- values to "off" on those fields then breaks the address autofill!!!
The solution to the autofill problem itself is simply change the field names. What I want to know is why? Can anyone clarify how I unwittingly poked Chrome's field name sniffing feature?
<fieldset>
<legend>Payment Information</legend>
<div><input autocomplete="cc-number" id="CreditCard_CardNumber" maxlength="16" name="CreditCard.CardNumber" pattern="\d*" required="" type="text" placeholder="Card Number" value="" /></div>
<div>
<label for="CreditCard_ExpirationMonth">Expires:</label>
<select autocomplete="cc-exp-month" id="cardExpirationMonth" name="CreditCard.ExpirationMonth" required="">
<option value="">Month</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
<select autocomplete="cc-exp-year" id="cardExpirationYear" name="CreditCard.ExpirationYear" required="">
<option value="">Year</option>
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
<option value="2022">2022</option>
<option value="2023">2023</option>
<option value="2024">2024</option>
<option value="2025">2025</option>
<option value="2026">2026</option>
<option value="2027">2027</option>
<option value="2028">2028</option>
<option value="2029">2029</option>
<option value="2030">2030</option>
<option value="2031">2031</option>
<option value="2032">2032</option>
<option value="2033">2033</option>
<option value="2034">2034</option>
<option value="2035">2035</option>
<option value="2036">2036</option>
<option value="2037">2037</option>
</select>
</div>
</fieldset>
Use the lower-case version of your names.
For me , using Name as name attribute is not working, autofill recognizes the field as CC !!
If I change it to name , works like a charm.
Hope this helps!
Data list doesn't appear. Tried everything. I know the data list is correct.
<input name="country" list="country_name">
<datalist i="country_name">
<option value="Afghanistan">
<option value="Albania">
<option value="Algeria">
<option value="Andorra">
<option value="Armenia">
<option value="Australia">
<option value="Austria">
<option value="Azerbaijan">
<!-- etc. -->
</datalist>
It should be id
<datalist id= "country_name">
You have a typo in the id of your datalist.
i="country_name" should be id="country_name"
<input name="country" list="country_name">
<datalist id="country_name">
<option value="Afghanistan">
<option value="Albania">
<option value="Algeria">
<option value="Andorra">
<option value="Armenia">
<option value="Australia">
<option value="Austria">
<option value="Azerbaijan">
<!-- etc. -->
</datalist>