I have been trying to use iron-form with a post method and i have some doubts on how does it works or even if I should be using it at all in some cases. So I am trying to find the answer to the following questions:
From what I understand, iron-form is only used for Ajax requests, so to make a regular post (that refreshes the page), I should not be using it, right? (True/False)
If I do not use the is='iron-form'
, is there any other way to validate fields for paper-input for example?
(Now this is what confuses me the most.) Using the iron-form with the post method, I only get the form data as "formData: [object Object]"
, which makes things totally useless on the backend that does not get the form element values ever.
Such behaviour can be seen on the iron-form demo page https://elements.polymer-project.org/elements/iron-form?view=demo:demo/index.html
Is there any way to send a post using iron-form and keep the regular post behaviour?
On searching on StackOverflow, this thread seems to take care of a similar problem Sending form with POST method and Polymer iron-form?, although the 'fix' did not work for me as I seem to be using the 1.0.8 version.
bower iron-form#^1.0.0 validate 1.0.8 against git://github.com/PolymerElements/iron-form.git#^1.0.0
The reason for the formData: [object Object] So it seems that the problem is solved in iron-ajax#1.0.4 I am using bower with PolymerElements/iron-elements as a dependency that only bumps until the version 1.0.0 of iron-ajax, once i forced iron-ajax to use v1.0.4 the the Payload from the form post seems to be corrected.
This issue is what drove me there https://github.com/PolymerElements/iron-ajax/pull/80
on-response
method and just call a function that refreshes the pagehtml
<iron-ajax
auto
url="http://gdata.youtube.com/feeds/api/videos/"
params='{"alt":"json", "q":"chrome"}'
handle-as="json"
on-response="handleResponse"
debounce-duration="300"></iron-ajax>
js e.g. something like
function handleResponse(){ location.reload(); }
or you could use this idea from robdodson and duplicate all of your form inputs, having each polymer element binding data into a matching hidden regular form element.
There's a bunch of ways, here is one http://plnkr.co/edit/2C7KmE?p=preview
<numbers-input></numbers-input>
<polymer-element name='numbers-input'>
<template>
<paper-input-decorator id='myPaperInput' label='Number' error='numbers only' floatingLabel autovalidate>
<input is='core-input' pattern='^[0-9]*$'>
</paper-input-decorator>
</template>
<script>Polymer();</script>
</polymer-element>
hmm, not sure about the cause of that. Seems a bad demo/bug. I took a look at the source code but didn't see anything obvious. I wonder if iron-ajax
is actually required or something? https://elements.polymer-project.org/elements/iron-ajax could be
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With