Search code examples
javascriptregexpolymer

regex condition not working on polymer paper-input, how to allow only decimal on paper input?


i am trying to allow only decimal on paper-input. Below are my conditions.

should not allow e should allow +, - Eg: -23.43 should allow only 12 value after DOT(in decimal) eg: 107.123456789012

so i tried below regex but both not working.

   ^(?!-0(\.0+)?$)-?(0|[1-9]\d*)(\.\d{1,12})?$
    /^(?!-0(\.0+)?$)-?(0|[1-9]\d*)(\.\d+)?$/

        <paper-input allowed-pattern="^(?!-0(\.0+)?$)-?(0|[1-9]\d*)(\.\d+)?$">
        </paper-input>

the above regex only integers, its not accepting decimal. So tried below one. its working fine. But not sure how to restrict decimal. i want to allow only 12 values after DOT(decimal)

<paper-input  allowed-pattern="[-.\d]"> </paper-input>

Solution

  • From the doc:

    pattern — RegEx pattern to validate input value

    <paper-input pattern="[A-Z]{2}[0-9]{6}"></paper-input>
    
    /**
    * For this input “EN123456” is a valid value, 
    * but "EN123456 " or " EN123456" are invalid values
    * because there are extra characters 
    * and value doesn't match a pattern
    */
    

    allowed-pattern — a pattern to restrict characters allowed to type in

    // accepts letters only
    <paper-input allowed-pattern="[a-zA-Z]"></paper-input>
    
    // accepts digits only
    <paper-input allowed-pattern="[0-9]"></paper-input>
    
    // accepts nothing, because one character cannot match this pattern
    <paper-input allowed-pattern="[0-9][A-Z]"></paper-input>
    

    Just should use:

    <paper-input pattern="^(?!-0(?:\.0+)?$)-?(?:0|[1-9]\d*)(?:\.\d+)?$">
    

    I've also change capture grops into non-capture groups, it's more efficient.