Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(275)

Side by Side Diff: third_party/polymer/v1_0/components/iron-form/iron-form.html

Issue 1214573003: Fix Polymer licensing issues (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: fix web-animations-js path Created 5 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!--
2 @license
3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 -->
10
11 <link rel="import" href="../polymer/polymer.html">
12 <link rel="import" href="../iron-ajax/iron-ajax.html">
13
14 <script>
15 /*
16 ``<iron-form>` is an HTML `<form>` element that can validate and submit any cust om
17 elements that implement `Polymer.IronFormElementBehavior`, as well as any
18 native HTML elements.
19
20 It supports both `get` and `post` methods, and uses an `iron-ajax` element to
21 submit the form data to the action URL.
22
23 Example:
24
25 <form is="iron-form" id="form" method="post" action="/form/handler">
26 <paper-input name="name" label="name"></paper-input>
27 <input name="address">
28 ...
29 </form>
30
31 By default, a native `<button>` element will submit this form. However, if you
32 want to submit it from a custom element's click handler, you need to explicitly
33 call the form's `submit` method.
34
35 Example:
36
37 <paper-button raised onclick="submitForm()">Submit</paper-button>
38
39 function submitForm() {
40 document.getElementById('form').submit();
41 }
42
43 @demo demo/index.html
44 */
45
46 Polymer({
47
48 is: 'iron-form',
49
50 extends: 'form',
51
52 /**
53 * Fired if the form cannot be submitted because it's invalid.
54 *
55 * @event iron-form-invalid
56 */
57
58 /**
59 * Fired after the form is submitted.
60 *
61 * @event iron-form-submit
62 */
63
64 /**
65 * Fired after the form is submitted and a response is received.
66 *
67 * @event iron-form-response
68 */
69
70 /**
71 * Fired after the form is submitted and an error is received.
72 *
73 * @event iron-form-error
74 */
75
76 listeners: {
77 'iron-form-element-register': '_registerElement',
78 'submit': '_onSubmit'
79 },
80
81 ready: function() {
82 // Object that handles the ajax form submission request.
83 this._requestBot = document.createElement('iron-ajax');
84 this._requestBot.addEventListener('response', this._handleFormResponse.bin d(this));
85 this._requestBot.addEventListener('error', this._handleFormError.bind(this ));
86
87 // Holds all the custom elements registered with this form.
88 this._customElements = [];
89 },
90
91 /**
92 * Called to submit the form.
93 */
94 submit: function() {
95 if (!this.noValidate && !this._validate()) {
96
97 // In order to trigger the native browser invalid-form UI, we need
98 // to do perform a fake form submit.
99 this._doFakeSubmitForValidation();
100 this.fire('iron-form-invalid');
101 return;
102 }
103
104 var json = this.serialize();
105
106 this._requestBot.url = this.action;
107 this._requestBot.method = this.method;
108 this._requestBot.params = json;
109
110 if (this.method == 'POST') {
111 this._requestBot.body = JSON.stringify(json);
112 }
113
114 this._requestBot.generateRequest();
115 this.fire('iron-form-submit', json);
116 },
117
118 _onSubmit: function(event) {
119 this.submit();
120
121 // Don't perform a page refresh.
122 if (event) {
123 event.preventDefault();
124 }
125
126 return false;
127 },
128
129 /**
130 * Returns a json object containing name/value pairs for all the registered
131 * custom components and native elements of the form. If there are elements
132 * with duplicate names, then their values will get aggregated into an
133 * array of values.
134 */
135 serialize: function() {
136 var json = {};
137
138 function addSerializedElement(el) {
139 // If the name doesn't exist, add it. Otherwise, serialize it to
140 // an array,
141 if (!json[el.name]) {
142 json[el.name] = el.value;
143 } else {
144 if (!Array.isArray(json[el.name])) {
145 json[el.name] = [json[el.name]];
146 }
147 json[el.name].push(el.value);
148 }
149 }
150
151 // Go through all of the registered custom components.
152 for (var el, i = 0; el = this._customElements[i], i < this._customElements .length; i++) {
153 if (el.name) {
154 addSerializedElement(el);
155 }
156 }
157
158 // Also go through the form's native elements.
159 for (var el, i = 0; el = this.elements[i], i < this.elements.length; i++) {
160 // Checkboxes and radio buttons should only use their value if they're c hecked.
161 // Also, custom elements that extend native elements (like an
162 // `<input is="fancy-input">`) will appear in both lists. Since they
163 // were already added as a custom element, they don't need
164 // to be re-added.
165 if (!el.name || !this._useValue(el) ||
166 (el.hasAttribute('is') && json[el.name])) {
167 continue;
168 }
169 addSerializedElement(el);
170 }
171
172 return json;
173 },
174
175 _handleFormResponse: function (event) {
176 this.fire('iron-form-response', event.detail.response);
177 },
178
179 _handleFormError: function (event) {
180 this.fire('iron-form-error', event.detail);
181 },
182
183 _registerElement: function(e) {
184 this._customElements.push(e.target);
185 },
186
187 _validate: function() {
188 var valid = true;
189
190 // Validate all the custom elements.
191 var validatable;
192 for (var el, i = 0; el = this._customElements[i], i < this._customElements .length; i++) {
193 if (el.required) {
194 validatable = /** @type {{validate: (function() : boolean)}} */ (el);
195 valid = validatable.validate() && valid;
196 }
197 }
198
199 // Validate the form's native elements.
200 for (var el, i = 0; el = this.elements[i], i < this.elements.length; i++) {
201 // Custom elements that extend a native element will also appear in
202 // this list, but they've already been validated.
203 if (!el.hasAttribute('is') && el.willValidate && el.checkValidity) {
204 valid = el.checkValidity() && valid;
205 }
206 }
207
208 return valid;
209 },
210
211 _useValue: function(el) {
212 // Checkboxes and radio buttons should only use their value if they're che cked.
213 if (el.type !== 'checkbox' && el.type !== 'radio') {
214 return true;
215 } else {
216 return el.checked;
217 }
218 },
219
220 _doFakeSubmitForValidation: function() {
221 var fakeSubmit = document.createElement('input');
222 fakeSubmit.setAttribute('type', 'submit');
223 fakeSubmit.style.display = 'none';
224 this.appendChild(fakeSubmit);
225
226 fakeSubmit.click();
227
228 this.removeChild(fakeSubmit);
229 }
230
231 });
232
233 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698