Polymer button should accept an optional submit attribute

[samccone]

When using polymers paper button within a form element, there is currently no way to submit said form with the paper button.

It would be dandy if I could set a type or submit attribute to make the button submit the form :)

---

Let me know if this is something you are interested in and I can PR it.

[andrewebdev]

I agree this would be good to have. I'm currently using on-click directly on the button as a workaround, but it would feel more natural to have a type="submit", and use the on-submit event directly on the form.

[robdodson]

That sounds handy. I'd be interested in checking out your PR if you have
time to put one together.
On Jul 21, 2014 7:10 AM, "Sam Saccone" notifications@github.com wrote:

When using polymers paper button within a form element, there is currently
no way to submit said form with the paper button.

It would be dandy if I could set a type or submit attribute to make the

button submit the form :)

Let me know if this is something you are interested in and I can PR it.

—
Reply to this email directly or view it on GitHub
#14.

[andrewebdev]

Thought I'd drop this in, I've used this as a workaround to this limitation for now:

<polymer-element name="paper-submit" extends="button" noscript>
    <template>
        <core-style ref="controls"></core-style>
        <style>
            :host {
                background: transparent;
                border: 0;
                padding: 0;
                font-size: inherit;
            }
        </style>
        <paper-button><content></content></paper-button>
    </template>
</polymer-element>

And this can then be used like so:

<button type="submit" is="paper-submit">Create</button>

Credit: http://stackoverflow.com/a/26952329/433267

[ssorallen]

Nice workaround, @andrewebdev.

Is there a reason why paper-button shouldn't always extend button?

<button type="submit" is="paper-button">Create</button>

[indolering]

This is a pretty fundamental feature for buttons. It would be ideal if @samccone would submit his fix as a PR but this seems to have been forgotten. Could we at least get this assigned to a milestone?

[indolering]

@ssorallen I lose styling when I extend paper button....

[samjonester]

It's completely ridiculous that there is not form submit button in this widget library! what a common activity! I cannot believe it doesn't exist!

[robdodson]

ping @notwaldorf

[notwaldorf]

I assume this is for the 1.0 element and not the 0.5 element, since the latter is very deprecated, so that's how I will answer this.

Sometime in the near future, Polymer will add inheritance for elements, and you can make your own paper-button that has this feature, if you really want to. It's unlikely that we will add a Submit attribute to paper-button because:

• the fact that buttons can magically submit forms is a bit weird. It's a weird encapsulation paradigm to have an element traverse its parent hierarchy until it finds a particular type (in this case, a form), and then do something to it. Implementation wise, this would be a bunch of extra work in an element which would not use this feature 90% of the time
• there are many simple workarounds: you can wrap your paper-button in a <button type=submit>: http://jsbin.com/fayima/edit?html,output. Or you can call form.submit() in the paper-button's click handler (see jsbin for example).

[samjonester]

It wouldn't be a button that magically does something to its parent. It would be a button with the type submit. Form submitting is a VERY COMMON html concept. Not having a submit button also means the form can't be submitted by pressing enter on any input within the form. Perhaps adding a new type to button isn't the correct solution and a new element type should be implemented. Form is also missing, but not necessary to be a paper element. Here is a reference for the specification. http://www.w3schools.com/html/html_forms.asp

[notwaldorf]

Have you checked out https://github.com/PolymerElements/iron-form?

[samjonester]

Thanks @notwaldorf close, but not quite. Still missing a submit input, meaning you can ONLY submit the form through a button's click action.