diff --git a/.travis.yml b/.travis.yml index 1c219fe..90b9972 100644 --- a/.travis.yml +++ b/.travis.yml @@ -2,31 +2,20 @@ language: node_js sudo: 'false' before_script: - npm install -g polymer-cli - - polymer install --variants - git checkout package-lock.json - - >- - npm run update-types && git diff --exit-code || (echo -e - '\n\033[31mERROR:\033[0m Typings are stale. Please run "npm run - update-types".' && false) - - >- - npm run format && git diff --exit-code || (echo -e '\n\033[31mERROR:\033[0m - Project is not formatted. Please run "npm run format".' && false) env: global: - - secure: >- - QuidjG1cfGHZXuA9/R2OP/41Lxmxu5drwr7IZvDww36vdY/dLg8gbMh1jKsQyDBfHsDbqDn5BKQw42tgeKBAvzgkkIBQsfsbNKiGhQ1No3NqhHjc/YOcF+R9ZksZbyyNVHUcHAH2pG/pTlbwGp7310k7EPrRPj0TWydfXysKw2iXdYetDxy8UiBt4injVIX5GM+BcD9df+2+BMVrQMyY1OmMsOmYeMDiHx7sWvoOUIyDvqk4teuQU+Oz7e8VrQlDeIiTcbHMzgu8FNeEqEMPgnvP4cIgJrP382G/pK2XLIniWo7eBMKmSuQ4KoyLEIv6NzUoOYeo6Fmpk2cWCCdSOfPP+los4g35KSqbs11gF/KIqoc8amuys+8yyEB069EKUsQUgqDYEc0wjN+OO2+WioGTIXC4TBvopIpQmkdcK/SptLqMhAPeLel3c+mBRcSvsXLgQj80fflgePS0vmL6K+njyNbIhduYP7tXc+lBljLnQJMU1Bz/2VDd3+7YakuiRyeogrCsr/yRmhzmdhG+8tklAdmgJULA329rrXlDQcPDg5QXJKt4+WfcAKIRUr30kQu04jWv35+spnvoqCpLNBGxjMSTXpYtNbpTG5kF/X5XZKM2oAV78PBTJ+QC+/GA/bjX47ldG+8Qp2GsfcMlRNbbbEk6tvOxrC5NLEXy8S4= - - secure: >- - OXzgSxgdxCcsj+iiPQRq0lduCZ9EecRQFFZ4rAN18tS/JamSK+ymUdTv4GGWDrTGR1/RSal8o99vnnkXBUto4IPoN8/pti4+VVFkrrDJt2L3ZTB1QgJ+Gh2/UpNF+NQJhLrPkywYeudM5+VGlLsTvz+TucbgfHjX4v1uy7z7ER1/cpCyOYdaYMa0Y8XgvJkenRwmK1pM+x0jWzZV6edCA3fsoKPoNfqttMKnWjO6iEOkuAYu/OumlBQPFUi6ZcIZhYadyZyVp8TYO3FY4NVYSAYF6/dwBDcuRlut70TkTOUm+4sVVsMaQIPZC0atfNa8zoiX24ugIpZi47dLFpbS4Ue3KyS0fGvMtD7SYxrg8fMUXdGqdPrnb7ar54kYVBYz6Cht9Lv365xqpJDBNTUFulxvSw0wgaZv8zHxf5WF0A2LRLxcUG8CgQBAIkoWrxiCrBC1tUOUFT1eaMsFgK16vo4ZeTFSzOTHpIz/AjCz2Tqh3SaYyJG3niAsWK8Sfj90aXfNuqG0Dw5FbiIXJ71XswbhDe4VTgkTSLdqoAy3HZpdH4Ccq1FS5taS2OuwZy0yVxkWYEfcP7VXCnBcy2CNw8cJcxlmPzRoyjsnyFZdVEtQwJ9LaFZ2+jmy6WuU9YmetTSR3uH90dRabTJikQHQbE8I+SRW6avtKjR11pHeZZc= + - secure: QuidjG1cfGHZXuA9/R2OP/41Lxmxu5drwr7IZvDww36vdY/dLg8gbMh1jKsQyDBfHsDbqDn5BKQw42tgeKBAvzgkkIBQsfsbNKiGhQ1No3NqhHjc/YOcF+R9ZksZbyyNVHUcHAH2pG/pTlbwGp7310k7EPrRPj0TWydfXysKw2iXdYetDxy8UiBt4injVIX5GM+BcD9df+2+BMVrQMyY1OmMsOmYeMDiHx7sWvoOUIyDvqk4teuQU+Oz7e8VrQlDeIiTcbHMzgu8FNeEqEMPgnvP4cIgJrP382G/pK2XLIniWo7eBMKmSuQ4KoyLEIv6NzUoOYeo6Fmpk2cWCCdSOfPP+los4g35KSqbs11gF/KIqoc8amuys+8yyEB069EKUsQUgqDYEc0wjN+OO2+WioGTIXC4TBvopIpQmkdcK/SptLqMhAPeLel3c+mBRcSvsXLgQj80fflgePS0vmL6K+njyNbIhduYP7tXc+lBljLnQJMU1Bz/2VDd3+7YakuiRyeogrCsr/yRmhzmdhG+8tklAdmgJULA329rrXlDQcPDg5QXJKt4+WfcAKIRUr30kQu04jWv35+spnvoqCpLNBGxjMSTXpYtNbpTG5kF/X5XZKM2oAV78PBTJ+QC+/GA/bjX47ldG+8Qp2GsfcMlRNbbbEk6tvOxrC5NLEXy8S4= + - secure: OXzgSxgdxCcsj+iiPQRq0lduCZ9EecRQFFZ4rAN18tS/JamSK+ymUdTv4GGWDrTGR1/RSal8o99vnnkXBUto4IPoN8/pti4+VVFkrrDJt2L3ZTB1QgJ+Gh2/UpNF+NQJhLrPkywYeudM5+VGlLsTvz+TucbgfHjX4v1uy7z7ER1/cpCyOYdaYMa0Y8XgvJkenRwmK1pM+x0jWzZV6edCA3fsoKPoNfqttMKnWjO6iEOkuAYu/OumlBQPFUi6ZcIZhYadyZyVp8TYO3FY4NVYSAYF6/dwBDcuRlut70TkTOUm+4sVVsMaQIPZC0atfNa8zoiX24ugIpZi47dLFpbS4Ue3KyS0fGvMtD7SYxrg8fMUXdGqdPrnb7ar54kYVBYz6Cht9Lv365xqpJDBNTUFulxvSw0wgaZv8zHxf5WF0A2LRLxcUG8CgQBAIkoWrxiCrBC1tUOUFT1eaMsFgK16vo4ZeTFSzOTHpIz/AjCz2Tqh3SaYyJG3niAsWK8Sfj90aXfNuqG0Dw5FbiIXJ71XswbhDe4VTgkTSLdqoAy3HZpdH4Ccq1FS5taS2OuwZy0yVxkWYEfcP7VXCnBcy2CNw8cJcxlmPzRoyjsnyFZdVEtQwJ9LaFZ2+jmy6WuU9YmetTSR3uH90dRabTJikQHQbE8I+SRW6avtKjR11pHeZZc= node_js: '9' addons: firefox: latest chrome: stable script: - - xvfb-run polymer test - - >- - if [ "${TRAVIS_PULL_REQUEST}" = "false" ]; then polymer test -s 'default'; - fi + - xvfb-run polymer test --module-resolution=node --npm + - 'if [ "${TRAVIS_PULL_REQUEST}" = "false" ]; then polymer test --module-resolution=node --npm -s ''default''; fi' dist: trusty cache: directories: - node_modules + diff --git a/bower.json b/bower.json deleted file mode 100644 index e378d2a..0000000 --- a/bower.json +++ /dev/null @@ -1,71 +0,0 @@ -{ - "name": "iron-form", - "version": "2.4.0", - "description": "Wrapper around native form that submits native and custom elements", - "keywords": [ - "web-components", - "polymer", - "form" - ], - "authors": [ - "The Polymer Authors" - ], - "main": "iron-form.html", - "private": true, - "repository": { - "type": "git", - "url": "git://github.com/PolymerElements/iron-form.git" - }, - "license": "http://polymer.github.io/LICENSE.txt", - "homepage": "https://github.com/PolymerElements/iron-form", - "ignore": [], - "dependencies": { - "polymer": "Polymer/polymer#1.9 - 2", - "iron-ajax": "PolymerElements/iron-ajax#1 - 2" - }, - "devDependencies": { - "iron-component-page": "PolymerElements/iron-component-page#1 - 2", - "iron-demo-helpers": "PolymerElements/iron-demo-helpers#1 - 2", - "paper-button": "PolymerElements/paper-button#1 - 2", - "paper-checkbox": "PolymerElements/paper-checkbox#1 - 2", - "paper-dropdown-menu": "PolymerElements/paper-dropdown-menu#1 - 2", - "paper-input": "PolymerElements/paper-input#1 - 2", - "paper-item": "PolymerElements/paper-item#1 - 2", - "paper-listbox": "PolymerElements/paper-listbox#1 - 2", - "paper-spinner": "PolymerElements/paper-spinner#1 - 2", - "paper-styles": "PolymerElements/paper-styles#1 - 2", - "web-animations-js": "web-animations/web-animations-js#^2.2", - "web-component-tester": "Polymer/web-component-tester#^6.0.0", - "webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0" - }, - "variants": { - "1.x": { - "dependencies": { - "polymer": "Polymer/polymer#^1.9", - "iron-ajax": "PolymerElements/iron-ajax#^1.0.0" - }, - "devDependencies": { - "iron-component-page": "PolymerElements/iron-component-page#^1.0.0", - "iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0", - "paper-button": "PolymerElements/paper-button#^1.0.0", - "paper-checkbox": "PolymerElements/paper-checkbox#^1.0.0", - "paper-dropdown-menu": "PolymerElements/paper-dropdown-menu#^1.0.0", - "paper-input": "PolymerElements/paper-input#^1.0.0", - "paper-item": "PolymerElements/paper-item#^1.0.0", - "paper-menu": "PolymerElements/paper-menu#^1.0.0", - "paper-spinner": "PolymerElements/paper-spinner#^1.0.0", - "paper-styles": "PolymerElements/paper-styles#^1.0.0", - "test-fixture": "PolymerElements/test-fixture#^1.0.0", - "web-animations-js": "web-animations/web-animations-js#^2.2", - "web-component-tester": "Polymer/web-component-tester#^4.0.0", - "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" - }, - "resolutions": { - "webcomponentsjs": "^0.7" - } - } - }, - "resolutions": { - "webcomponentsjs": "^1.0.0" - } -} diff --git a/demo/cats-only.html b/demo/cats-only.js similarity index 50% rename from demo/cats-only.html rename to demo/cats-only.js index 16b48a6..82562ff 100644 --- a/demo/cats-only.html +++ b/demo/cats-only.js @@ -1,4 +1,4 @@ - - - - - - - - - + // Overidden from Polymer.IronValidatableBehavior. Will set the `invalid` + // attribute automatically, which should be used for styling. + _getValidity: function() { + return this.value === 'cats'; + } +}); diff --git a/demo/index.html b/demo/index.html index 226da7b..5190643 100644 --- a/demo/index.html +++ b/demo/index.html @@ -16,23 +16,34 @@ - + - - - - - - - - - - - - + + + + + + + + + + + + - + + -
+ + </script> @@ -118,7 +135,7 @@

You can submit a form in many different ways: by manually calling subm
- You must check this box. + You must check this box.

Using a native button to submit the form will display the native browser validation UI for native elements:

@@ -126,8 +143,8 @@

You can submit a form in many different ways: by manually calling subm

Using a custom element to submit the form will not display the native browser validation UI:

- Submit - Reset + Submit + Reset
@@ -136,7 +153,7 @@

You can submit a form in many different ways: by manually calling subm form2.addEventListener('iron-form-submit', function(event) { this.querySelector('.output').innerHTML = JSON.stringify(event.detail); }); - + </script> @@ -145,9 +162,9 @@

To customize the request sent to the server, you can listen to the iro @@ -170,12 +187,12 @@

Example of an iron-form reacting to state changes

+ + + +

Iron-form respects the novalidate form attribute

+ + @@ -219,11 +294,23 @@

Iron-form respects the novalidate form attribute

- + @@ -245,11 +332,23 @@

iron-form respects nested elements

- +

diff --git a/index.html b/index.html index acd7140..4a4ce47 100644 --- a/index.html +++ b/index.html @@ -16,10 +16,10 @@ iron-form - + - - + + diff --git a/iron-form.d.ts b/iron-form.d.ts deleted file mode 100644 index 0a3bfbe..0000000 --- a/iron-form.d.ts +++ /dev/null @@ -1,162 +0,0 @@ -/** - * DO NOT EDIT - * - * This file was automatically generated by - * https://github.com/Polymer/gen-typescript-declarations - * - * To modify these typings, edit the source file(s): - * iron-form.html - */ - -/// -/// - -/** - * `` is a wrapper around the HTML `
` element, that can - * validate and submit both custom and native HTML elements. Note that this - * is a breaking change from iron-form 1.0, which was a type extension. - * - * It has two modes: if `allow-redirect` is true, then after the form submission you - * will be redirected to the server response. Otherwise, if it is false, it will - * use an `iron-ajax` element to submit the form contents to the server. - * - * Example: - * - * - * - * - * I like donuts
- * - * - *
- * - * By default, a native ` - * - * function submitForm() { - * document.getElementById('myForm').submit(); - * } - * - * If you are not using the `allow-redirect` mode, then you also have the option of - * customizing the request sent to the server. To do so, you can listen to the `iron-form-presubmit` - * event, and modify the form's [`iron-ajax`](https://elements.polymer-project.org/elements/iron-ajax) - * object. However, If you want to not use `iron-ajax` at all, you can cancel the - * event and do your own custom submission: - * - * Example of modifying the request, but still using the build-in form submission: - * - * form.addEventListener('iron-form-presubmit', function() { - * this.request.method = 'put'; - * this.request.params['extraParam'] = 'someValue'; - * }); - * - * Example of bypassing the build-in form submission: - * - * form.addEventListener('iron-form-presubmit', function(event) { - * event.preventDefault(); - * var firebase = new Firebase(form.getAttribute('action')); - * firebase.set(form.serializeForm()); - * }); - * - * Note that if you're dynamically creating this element, it's mandatory that you - * first create the contained `
` element and all its children, and only then - * attach it to the ``: - * - * var wrapper = document.createElement('iron-form'); - * var form = document.createElement('form'); - * var input = document.createElement('input'); - * form.appendChild(input); - * document.body.appendChild(wrapper); - * wrapper.appendChild(form); - */ -interface IronFormElement extends Polymer.Element { - - /** - * Set this to true if you don't want the form to be submitted through an - * ajax request, and you want the page to redirect to the action URL - * after the form has been submitted. - */ - allowRedirect: boolean|null|undefined; - - /** - * HTTP request headers to send. See PolymerElements/iron-ajax for - * more details. Only works when `allowRedirect` is false. - */ - headers: object|null|undefined; - - /** - * Set the `withCredentials` flag on the request. See - * PolymerElements/iron-ajax for more details. Only works when - * `allowRedirect` is false. - */ - withCredentials: boolean|null|undefined; - attached(): void; - detached(): void; - _init(): void; - - /** - * Saves the values of all form elements that will be used when resetting - * the form. Initially called asynchronously on attach. Any time you - * call this function, the previously saved values for a form element will - * be overwritten. - * - * This function is useful if you are dynamically adding elements to - * the form, or if your elements are asynchronously setting their values. - */ - saveResetValues(): void; - _saveInitialValues(overwriteValues?: boolean): void; - - /** - * Validates all the required elements (custom and native) in the form. - * - * @returns True if all the elements are valid. - */ - validate(): boolean; - - /** - * Submits the form. - */ - submit(event?: Event|null): void; - - /** - * Resets the form to the default values. - */ - reset(event?: Event|null): void; - - /** - * Serializes the form as will be used in submission. Note that `serialize` - * is a Polymer reserved keyword, so calling `someIronForm`.serialize()` - * will give you unexpected results. - * - * @returns An object containing name-value pairs for elements that - * would be submitted. - */ - serializeForm(): {[key: string]: any}; - _handleFormResponse(event: any): void; - _handleFormError(event: any): void; - _makeAjaxRequest(json: any): void; - _getValidatableElements(): any; - _getSubmittableElements(): any; - _serializeElementValues(element: any): any; - _serializeSelectValues(element: any): any; - _serializeInputValues(element: any): any; - _createHiddenElement(name: any, value: any): any; - _addSerializedElement(json: any, name: any, value: any): void; -} - -interface HTMLElementTagNameMap { - "iron-form": IronFormElement; -} diff --git a/iron-form.html b/iron-form.html deleted file mode 100644 index 2fced8b..0000000 --- a/iron-form.html +++ /dev/null @@ -1,636 +0,0 @@ - - - - - - - - - - - - diff --git a/iron-form.js b/iron-form.js new file mode 100644 index 0000000..41bbcc7 --- /dev/null +++ b/iron-form.js @@ -0,0 +1,637 @@ +/** +@license +Copyright (c) 2015 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt +Code distributed by Google as part of the polymer project is also +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +/** +`` is a wrapper around the HTML `` element, that can +validate and submit both custom and native HTML elements. Note that this +is a breaking change from iron-form 1.0, which was a type extension. + +It has two modes: if `allow-redirect` is true, then after the form submission you +will be redirected to the server response. Otherwise, if it is false, it will +use an `iron-ajax` element to submit the form contents to the server. + + Example: + + + + + I like donuts
+ + + + +By default, a native ` + + function submitForm() { + document.getElementById('myForm').submit(); + } + +If you are not using the `allow-redirect` mode, then you also have the option of +customizing the request sent to the server. To do so, you can listen to the `iron-form-presubmit` +event, and modify the form's [`iron-ajax`](https://elements.polymer-project.org/elements/iron-ajax) +object. However, If you want to not use `iron-ajax` at all, you can cancel the +event and do your own custom submission: + + Example of modifying the request, but still using the build-in form submission: + + form.addEventListener('iron-form-presubmit', function() { + this.request.method = 'put'; + this.request.params['extraParam'] = 'someValue'; + }); + + Example of bypassing the build-in form submission: + + form.addEventListener('iron-form-presubmit', function(event) { + event.preventDefault(); + var firebase = new Firebase(form.getAttribute('action')); + firebase.set(form.serializeForm()); + }); + +Note that if you're dynamically creating this element, it's mandatory that you +first create the contained `
` element and all its children, and only then +attach it to the ``: + + var wrapper = document.createElement('iron-form'); + var form = document.createElement('form'); + var input = document.createElement('input'); + form.appendChild(input); + document.body.appendChild(wrapper); + wrapper.appendChild(form); + +@element iron-form +@hero hero.svg +@demo demo/index.html +*/ +/* + FIXME(polymer-modulizer): the above comments were extracted + from HTML and may be out of place here. Review them and + then delete this comment! +*/ +import '@polymer/polymer/polymer-legacy.js'; + +import '@polymer/iron-ajax/iron-ajax.js'; +import { Polymer } from '@polymer/polymer/lib/legacy/polymer-fn.js'; +import { html } from '@polymer/polymer/lib/utils/html-tag.js'; +import { dom } from '@polymer/polymer/lib/legacy/polymer.dom.js'; + +Polymer({ + _template: html` + + + + + + + +`, + + is: 'iron-form', + + properties: { + /* + * Set this to true if you don't want the form to be submitted through an + * ajax request, and you want the page to redirect to the action URL + * after the form has been submitted. + */ + allowRedirect: {type: Boolean, value: false}, + /** + * HTTP request headers to send. See PolymerElements/iron-ajax for + * more details. Only works when `allowRedirect` is false. + */ + headers: { + type: Object, + value: function() { + return {}; + } + }, + /** + * Set the `withCredentials` flag on the request. See + * PolymerElements/iron-ajax for more details. Only works when + * `allowRedirect` is false. + */ + withCredentials: {type: Boolean, value: false}, + }, + + /** + * Fired if the form cannot be submitted because it's invalid. + * + * @event iron-form-invalid + */ + + /** + * Fired after the form is submitted. + * + * @event iron-form-submit + */ + + /** + * Fired before the form is submitted. + * + * @event iron-form-presubmit + */ + + /** + * Fired after the form is reset. + * + * @event iron-form-reset + */ + + /** + * Fired after the form is submitted and a response is received. An + * IronRequestElement is included as the event.detail object. + * + * @event iron-form-response + */ + + /** + * Fired after the form is submitted and an error is received. An + * error message is included in event.detail.error and an + * IronRequestElement is included in event.detail.request. + * + * @event iron-form-error + */ + + /** + * @return {void} + */ + attached: function() { + // We might have been detached then re-attached. + // Avoid searching again for the
if we already found it. + if (this._form) { + return; + } + // Search for the ``, if we don't find it, observe for + // mutations. + this._form = dom(this).querySelector('form'); + if (this._form) { + this._init(); + // Since some elements might not be upgraded yet at this time, + // we won't be able to look into their shadowRoots for submittables. + // We wait a tick and check again for any missing submittable default + // values. + this.async(this._saveInitialValues.bind(this), 1); + } else { + this._nodeObserver = dom(this).observeNodes(function(mutations) { + for (var i = 0; i < mutations.addedNodes.length; i++) { + if (mutations.addedNodes[i].tagName === 'FORM') { + this._form = mutations.addedNodes[i]; + // At this point in time, all custom elements are expected + // to be upgraded, hence we'll be able to traverse their + // shadowRoots. + this._init(); + dom(this).unobserveNodes(this._nodeObserver); + this._nodeObserver = null; + } + } + }.bind(this)); + } + }, + + /** + * @return {void} + */ + detached: function() { + if (this._nodeObserver) { + dom(this).unobserveNodes(this._nodeObserver); + this._nodeObserver = null; + } + }, + + _init: function() { + this._form.addEventListener('submit', this.submit.bind(this)); + this._form.addEventListener('reset', this.reset.bind(this)); + + // Save the initial values. + this._defaults = this._defaults || new WeakMap(); + this._saveInitialValues(); + }, + + /** + * Saves the values of all form elements that will be used when resetting + * the form. Initially called asynchronously on attach. Any time you + * call this function, the previously saved values for a form element will + * be overwritten. + * + * This function is useful if you are dynamically adding elements to + * the form, or if your elements are asynchronously setting their values. + * @return {void} + */ + saveResetValues: function() { + this._saveInitialValues(true); + }, + + /** + * @param {boolean=} overwriteValues + * @return {void} + */ + _saveInitialValues: function(overwriteValues) { + var nodes = this._getValidatableElements(); + for (var i = 0; i < nodes.length; i++) { + var node = nodes[i]; + if (!this._defaults.has(node) || overwriteValues) { + // Submittables are expected to have `value` property, + // that's what gets serialized. + var defaults = {value: node.value}; + if ('checked' in node) { + defaults.checked = node.checked; + } + // In 1.x iron-form would reset `invalid`, so + // keep it here for backwards compat. + if ('invalid' in node) { + defaults.invalid = node.invalid; + } + this._defaults.set(node, defaults); + } + } + }, + + /** + * Validates all the required elements (custom and native) in the form. + * @return {boolean} True if all the elements are valid. + */ + validate: function() { + // If you've called this before distribution happened, bail out. + if (!this._form) { + return false; + } + + if (this._form.getAttribute('novalidate') === '') + return true; + + // Start by making the form check the native elements it knows about. + var valid = this._form.checkValidity(); + var elements = this._getValidatableElements(); + + // Go through all the elements, and validate the custom ones. + for (var el, i = 0; el = elements[i], i < elements.length; i++) { + // This is weird to appease the compiler. We assume the custom element + // has a validate() method, otherwise we can't check it. + var validatable = /** @type {{validate: (function() : boolean)}} */ (el); + if (validatable.validate) { + valid = !!validatable.validate() && valid; + } + } + return valid; + }, + + /** + * Submits the form. + * + * @param {Event=} event + * @return {void} + */ + submit: function(event) { + // We are not using this form for submission, so always cancel its event. + if (event) { + event.preventDefault(); + } + + // If you've called this before distribution happened, bail out. + if (!this._form) { + return; + } + + if (!this.validate()) { + this.fire('iron-form-invalid'); + return; + } + + // Remove any existing children in the submission form (from a previous + // submit). + this.$.helper.textContent = ''; + + var json = this.serializeForm(); + + // If we want a redirect, submit the form natively. + if (this.allowRedirect) { + // If we're submitting the form natively, then create a hidden element for + // each of the values. + for (var element in json) { + this.$.helper.appendChild( + this._createHiddenElement(element, json[element])); + } + + // Copy the original form attributes. + this.$.helper.action = this._form.getAttribute('action'); + this.$.helper.method = this._form.getAttribute('method') || 'GET'; + this.$.helper.contentType = this._form.getAttribute('enctype') || + 'application/x-www-form-urlencoded'; + + this.$.helper.submit(); + this.fire('iron-form-submit'); + } else { + this._makeAjaxRequest(json); + } + }, + + /** + * Resets the form to the default values. + * + * @param {Event=} event + * @return {void} + */ + reset: function(event) { + // We are not using this form for submission, so always cancel its event. + if (event) + event.preventDefault(); + + // If you've called this before distribution happened, bail out. + if (!this._form) { + return; + } + + // Ensure the native form fired the `reset` event. + // User might have bound `