OLD | NEW |
(Empty) | |
| 1 |
| 2 <!--- |
| 3 |
| 4 This README is automatically generated from the comments in these files: |
| 5 iron-form.html |
| 6 |
| 7 Edit those files, and our readme bot will duplicate them over here! |
| 8 Edit this file, and the bot will squash your changes :) |
| 9 |
| 10 The bot does some handling of markdown. Please file a bug if it does the wrong |
| 11 thing! https://github.com/PolymerLabs/tedium/issues |
| 12 |
| 13 --> |
| 14 |
| 15 [![Build status](https://travis-ci.org/PolymerElements/iron-form.svg?branch=mast
er)](https://travis-ci.org/PolymerElements/iron-form) |
| 16 |
| 17 _[Demo and API docs](https://elements.polymer-project.org/elements/iron-form)_ |
| 18 |
| 19 |
| 20 ##<iron-form> |
| 21 |
| 22 `<iron-form>` is an HTML `<form>` element that can validate and submit any custo
m |
| 23 elements that implement `Polymer.IronFormElementBehavior`, as well as any |
| 24 native HTML elements. For more information on which attributes are |
| 25 available on the native form element, see [https://developer.mozilla.org/en-US/d
ocs/Web/HTML/Element/form](https://developer.mozilla.org/en-US/docs/Web/HTML/Ele
ment/form) |
| 26 |
| 27 It supports both `get` and `post` methods, and uses an `iron-ajax` element to |
| 28 submit the form data to the action URL. |
| 29 |
| 30 Example: |
| 31 |
| 32 ```html |
| 33 <form is="iron-form" id="form" method="post" action="/form/handler"> |
| 34 <paper-input name="name" label="name"></paper-input> |
| 35 <input name="address"> |
| 36 ... |
| 37 </form> |
| 38 ``` |
| 39 |
| 40 By default, a native `<button>` element will submit this form. However, if you |
| 41 want to submit it from a custom element's click handler, you need to explicitly |
| 42 call the form's `submit` method. |
| 43 |
| 44 Example: |
| 45 |
| 46 ```html |
| 47 <paper-button raised onclick="submitForm()">Submit</paper-button> |
| 48 |
| 49 function submitForm() { |
| 50 document.getElementById('form').submit(); |
| 51 } |
| 52 ``` |
| 53 |
| 54 To customize the request sent to the server, you can listen to the `iron-form-pr
esubmit` |
| 55 event, and modify the form's[`iron-ajax`](https://elements.polymer-project.org/e
lements/iron-ajax) |
| 56 object. However, If you want to not use `iron-ajax` at all, you can cancel the |
| 57 event and do your own custom submission: |
| 58 |
| 59 Example of modifying the request, but still using the build-in form submission
: |
| 60 |
| 61 ```javascript |
| 62 form.addEventListener('iron-form-presubmit', function() { |
| 63 this.request.method = 'put'; |
| 64 this.request.params = someCustomParams; |
| 65 }); |
| 66 ``` |
| 67 |
| 68 Example of bypassing the build-in form submission: |
| 69 |
| 70 ```javascript |
| 71 form.addEventListener('iron-form-presubmit', function(event) { |
| 72 event.preventDefault(); |
| 73 var firebase = new Firebase(form.getAttribute('action')); |
| 74 firebase.set(form.serialize()); |
| 75 }); |
| 76 ``` |
| 77 |
| 78 |
OLD | NEW |