Ah! So that's not super intuitive on how to do this. Opened a bug to
produce some better docs: https://github.com/Polymer/paper-input/issues/98
Here's the gist:
<template is="auto-binding">
<paper-input-decorator label="Number" floatingLabel
error="is not a number"
isInvalid="{{!$.input.validity.valid}}">
<input id="input" is="core-input" pattern="\d*">
</paper-input-decorator>
</template>
<script>
CoreStyle.g.paperInput.invalidColor = 'red';
</script>
On Wed, Nov 12, 2014 at 11:48 AM, Yvonne Yip <[email protected]> wrote:
> You need to bind the isInvalid property on the paper-input-decorator to
> the validity property on the input. The demo for paper-input contains an
> example.
>
> On Tue, Nov 11, 2014 at 4:10 PM, James L <[email protected]> wrote:
>
>> Nope, the errors if using non-numeric inputs doesn't shown on Google
>> Chrome, not sure if other browsers having issues too.
>>
>> On Wed, Nov 12, 2014 at 7:54 AM, Eric Bidelman <[email protected]> wrote:
>>
>>> Should this work? http://jsbin.com/kumerocoju/1/edit
>>>
>>> <paper-input-decorator label="Number" floatingLabel error="input is
>>> should be a number!">
>>> <input is="core-input" pattern="[0-9]">
>>> </paper-input-decorator>
>>>
>>>
>>> On Wed, Nov 12, 2014 at 10:16 AM, Yvonne Yip <[email protected]> wrote:
>>>
>>>> There's an example of how to use paper-input-decorator with HTML
>>>> constraints validation in the paper-input demo. It's validating using the
>>>> "required" attribute instead of "pattern", but the usage should be similar.
>>>>
>>>> paper-input does not support passing in validation attributes by design.
>>>>
>>>> On Tue, Nov 11, 2014 at 3:06 PM, Eric Bidelman <[email protected]>
>>>> wrote:
>>>>
>>>>> Yvonne, do we have a good example of how to do pattern validation
>>>>> doing the new stuff? I tried to hunt it down myself but there doesn't seem
>>>>> to be API docs for it.
>>>>>
>>>>> On Wed, Nov 12, 2014 at 6:16 AM, James L <[email protected]>
>>>>> wrote:
>>>>>
>>>>>> Following paper-input example from
>>>>>> https://www.youtube.com/watch?v=HKrYfrAzqFA
>>>>>>
>>>>>> <paper-input floatingLabel label="Choose a number:"
>>>>>> value="{{item.innum}}" validate="^[0-9]*$" error="Not a
>>>>>> number"></paper-input>
>>>>>>
>>>>>> Don't throw any errors if I type characters, did I miss out any?
>>>>>>
>>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>>>>>> ---
>>>>>> You received this message because you are subscribed to the Google
>>>>>> Groups "Polymer" group.
>>>>>> To unsubscribe from this group and stop receiving emails from it,
>>>>>> send an email to [email protected].
>>>>>> To view this discussion on the web visit
>>>>>> https://groups.google.com/d/msgid/polymer-dev/2859a108-4737-4c24-8d0b-69ed36a5eb9b%40googlegroups.com
>>>>>> <https://groups.google.com/d/msgid/polymer-dev/2859a108-4737-4c24-8d0b-69ed36a5eb9b%40googlegroups.com?utm_medium=email&utm_source=footer>
>>>>>> .
>>>>>> For more options, visit https://groups.google.com/d/optout.
>>>>>>
>>>>>
>>>>>
>>>>
>>>
>>
>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/CACGqRCAtPc6KVJ3BwtF4PfFWkuA3EWYbKaKVRt_aPvQ6reDYRQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
