| <!-- A page that is used to test that a dynamic form fill only fills fields of a group type present in the initial fill. --> |
| <body> |
| <!-- A form that does not ask for name or email --> |
| <form name="addr1.1" id="form1" action="https://example.com/" method="post"> |
| Name: <input type="text" name="firstname" id="firstname"><br> |
| Address: <input type="text" name="address1" id="address1"><br> |
| City: <input type="text" name="city" id="city"><br> |
| State: <select name="state" id="state"> |
| <option value="CA">CA</option> |
| <option value="MA">MA</option> |
| <option value="NY">NY</option> |
| <option value="MD">MD</option> |
| <option value="OR">OR</option> |
| <option value="OH">OH</option> |
| <option value="IL">IL</option> |
| <option value="DC">DC</option> |
| </select> <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> |
| <!-- A hidden email field --> |
| <input name="email" id="email" type="hidden"> <br> |
| <!-- An international phone field --> |
| Phone: <input name="phone" id="phone" autocomplete="tel-national"> <br> |
| <input type="reset" value="Reset"> |
| <input type="submit" value="Submit" id="profile_submit"> |
| </form> |
| </body> |
| |
| <script src="dynamic_form_utils.js"></script> |
| <script> |
| |
| var notify_on_first_name_input_change = false; |
| var first_name_input_changed = false; |
| |
| function CountryChanged() { |
| RemoveForm('form1'); |
| var new_form = AddNewFormAndFields('form1', 'addr1.1'); |
| |
| // Set a different type of phone field. |
| new_form.elements[6].setAttribute('autocomplete', 'tel-national'); |
| |
| var first_name_input = new_form.elements[0]; |
| first_name_input.onchange = function() { |
| if (notify_on_first_name_input_change) |
| window.domAutomationController.send(first_name_input.value != ''); |
| else |
| first_name_input_changed = true; |
| } |
| |
| document.getElementsByTagName('body')[0].appendChild(new_form); |
| } |
| |
| function hasRefilled() { |
| var first_name_input = document.getElementById('firstname_form1'); |
| if (first_name_input && first_name_input_changed) { |
| window.domAutomationController.send(first_name_input.value != ''); |
| } else { |
| notify_on_first_name_input_change = true; |
| } |
| } |
| |
| </script> |