CODEWITHSUNDEEP
jquery-plugins
Andy
Andy

Reputation: 41

Jquerymobile input mask?

I need an input mask for numerics, like "9999.99" - or "9999.9" . I know there are plugins for jquery in general - question is: Has anybody used one with jquerymobile? Thanks gang!

Upvotes: 3

Views: 6804

Answers (4)

Raja Ram T
Raja Ram T

Reputation: 9071

Recently I have developed simple and easy input mask on input field to US phone format jquery-input-mask-phone-number

Just Add jquery-input-mask-phone-number plugin and call usPhoneFormat Function.

$(document).ready(function () {
    $('#yourphone').usPhoneFormat({
        format: 'xxx-xxx-xxxx',
    });   
});

Demo Example https://jsfiddle.net/1kbat1nb/

NPM URL https://www.npmjs.com/package/jquery-input-mask-phone-number

GitHub URL https://github.com/rajaramtt/jquery-input-mask-phone-number

Upvotes: 0

user985393
user985393

Reputation: 83

This jsFiddle link working with phone

The HTML is:

<form id="contact_info_form">   
    Cell Phone: <br/>
    <input type="text" value="" class="input-phone" name="Q3" id="Q3" />      
</form>​

And the Javascript:

$(function(){
  $(".input-phone").mask("(999)-999-9999");    
});​

Upvotes: 0

Ernoriel
Ernoriel

Reputation: 89

this plugin seems nice on desktop, but for some reasons it has some problems on mobile devices (tested on android 2.3.3). 2 problems I had :

  • with $('#someInput').mask("99/99/9999",{placeholder:"."}); when I type 12345678, I obtain 12/45/7863 (some problems when placing the '/'s)

  • when I try to give a value (calculated before but editable) it put the '../../....' in place when I focus the input.

Do someone have a workaround or a more mobile device friendly mask plugin?

Edit: After a lot of tries and failures, it seems the problem is not in the masked input plugin (which is not realy a news as it works perfectly on desktops and Ios) but it's the way android manage the modification of the value of a focus input. When you add a character, it display it well but remember where the cursor was and do not move it so when you type afterward it seem's it go back before the adding.

I tried to do the trick by adding a setrange but it seems to don't account the added characters. Out of ideas I did it by filtering input on keypress, spacing the characters in the input and putting an image of / / in the background.

I'm still open to anything which could be cleaner.

Upvotes: 2

user1102231
user1102231

Reputation: 13

There's awsome plugin to use in jquery in http://digitalbush.com/projects/masked-input-plugin/ It work awsome when used in pc. But when i try on opera mobile emulator. It messed up.

Upvotes: 1

Related Questions