javascript - How to submit a form with polymer? - Stack Overflow

admin管理员组

文章数量:1315337

I've have this polymer contact-element:

<polymer-element name="contact-element">
  <template>
    <paper-input label="Your Name" id="contact-name" floatingLabel></paper-input>
    <paper-input multiline label="Your text here..." id="contact-message" floatingLabel></paper-input>
    <paper-button label="Send Data" id="contact-submit" raisedButton></paper-button>
  </template>
  <script>
    Polymer({});
  </script>
</polymer-element>

It's included in this index.html

<form action="/sendMessage" method="GET">
        <contact-element></contact-element>
</form>

Is there an submit-attribute for the paper-button or do I have to do the submit with JS?

I've have this polymer contact-element:

<polymer-element name="contact-element">
  <template>
    <paper-input label="Your Name" id="contact-name" floatingLabel></paper-input>
    <paper-input multiline label="Your text here..." id="contact-message" floatingLabel></paper-input>
    <paper-button label="Send Data" id="contact-submit" raisedButton></paper-button>
  </template>
  <script>
    Polymer({});
  </script>
</polymer-element>

It's included in this index.html

<form action="/sendMessage" method="GET">
        <contact-element></contact-element>
</form>

Is there an submit-attribute for the paper-button or do I have to do the submit with JS?

• javascript
• polymer

Share Improve this question Follow asked Jul 25, 2014 at 9:18 alexPalexP 3,76577 gold badges2929 silver badges3636 bronze badges 5

• 1 As far as I know you still need to deal with sending forms like always. Isn't polymer just a custom tag and import library? – morkro Commented Jul 25, 2014 at 9:23
• Yes, but polymer doesn't render a "real" button. It's only a CSS-styled DIV. So it's not possible to submit my form. – alexP Commented Jul 25, 2014 at 9:33
• Why don't you just use a <button type="submit">..</button>? – morkro Commented Jul 25, 2014 at 9:41
• I thought there is a way to use the paper-button elements. They are already styled with css. – alexP Commented Jul 25, 2014 at 9:44
• stackoverflow./questions/24867107/… – Oliver Commented Jul 25, 2014 at 18:48

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 2

Try the ajax-form element: http://ajax-form.raynicholus..

It supports the paper elements.

For any future Readers, now that 1.0 is released:

This is basic html form processing. At the time of this writing, Polymer now has the iron-form, but you still submit it like any other form.

<form is="iron-form" id="form" method="post" action="/">

  <paper-input name="testinput"></paper-input>

  <paper-button raised click="document.getElementById('form').submit();">
     Post
  </paper-button>

</form>

From Polymer's blog: https://blog.polymer-project/featured/2014/09/23/featured-002/

Ray Nicholus’ ajax-form element provides a simple way to submit forms. ajax-form works with traditional form elements, as well as any custom elements that have both a name attribute and a value – including the Core and Paper input elements.

https://github./rnicholus/ajax-form http://ajax-form.raynicholus.

Since, as you pointed out, paper-buttons do not extend the native button element, you will have to either write your own JavaScript to handle form submission or wait for the uping paper-forms Polymer element.

本文标签： javascriptHow to submit a form with polymerStack Overflow