Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

paper-button with type="submit" within form doesn't submit?

I am trying to use paper-button with type attribute set to submit (as one would do with button element) to submit the enclosing form, but for some reason it is unable to submit the form. Is this a bug or feature?

How to make paper-button submit the form?

PS: I am in dart land (not js).

like image 951
adarshaj Avatar asked Jul 21 '14 14:07

adarshaj


People also ask

Why the submit button is not working?

Sometimes the problem is caused by old versions of the Javascript files, cached by your browser and can be fixed by clearing the browser cache. You can use the browser console of your browser for debugging. After the Javascript error is fixed, the submit button will automatically be enabled.

Does the submit button go inside the form?

Yes, structurally the submit button needs to be inside a form element for the document to be valid X/HTML. But visually you can position the submit button anywhere you want with appropriate CSS (float, absolute/relative positioning, etc).

Can a button submit without a form?

Submit buttons don't submit if they are not in a form. Not sure why you think form's can't be in a table? (As you already wrote in the title:) The button has no form associated to .... - So asking the question contains the answer: Add the form which is yet missing.

Why does my Google form not have a submit button?

The submit button always appears after the last visible field on your form. When this doesn't happen, it usually means there are required fields that need to be answered before finishing your submission.


1 Answers

As noticed by Gunter, you can create a custom element which extends some of native element with your desired semantics.

I encountered with your issue too and I've created simple element which gives ability to submit to paper-button

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

Then you can write this

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

And will get a button with paper-like look

like image 179
just-boris Avatar answered Oct 05 '22 11:10

just-boris