<!-- A page that is used to test that a dynamic form fill feature works properly. -->
<body>
<form name="addr1.1" id="form1" action="https://example.com/" method="post">
Name: <input type="text" name="firstname" id="firstname" autocomplete="given-name"><br>
Address: <input type="text" name="address1" id="address1"><br>
City: <input type="text" name="city" id="city"><br>
State/Province:
<select name="state_ca" id="state_ca" autocomplete="region">
<option value="BC">BC</option>
<option value="QC">QC</option>
<option value="NS">NS</option>
<option value="AL">AL</option>
<option value="ON">ON</option>
</select> <br>
<input type="text" name="state_us" id="state_us" style="display: none;" autocomplete="region"><br>
Zip: <input name="zip" id="zip"> <br>
Country: <select name="country" id="country" onchange="CountryChanged()">
<option value="CA">Canada</option>
<option value="US">United States</option>
</select> <br>
Company: <input name="company" id="company"> <br>
Email: <input name="email" id="email"> <br>
Phone: <input name="phone" id="phone"> <br>
<input type="reset" value="Reset">
<input type="submit" value="Submit" id="profile_submit">
</form>
</body>
<script>
function CountryChanged() {
var first_name_input = document.getElementById("firstname");
// Reset the value of the first name field.
first_name_input.value = '';
// Get the select object for states of canada and hide it.
var state_ca = document.getElementById("state_ca");
state_ca.setAttribute('style', "display: none;");
var state_us = document.getElementById("state_us");
state_us.removeAttribute('style');
window['refill'] = true;
console.log('An event happened that should trigger a refill.');
}
</script>
Codebase Browser
chromium