Kiran
Kiran

Reputation: 5526

jquery mobile input masking not working

I am trying to mask SSN input using jquery mask plugin, however it doesn't seem to play well with jquery mobile. The code is here. Appreciate any help.

If this doesnt work, what are the alternatives?

Also copied the code for reference below:

Scripts:

jquery.mobile-1.0.1.min.css
jquery-1.6.4.min.js 
jquery.mobile-1.0.1.min.js

$("#ssnprimary").mask("999-99-9999");

HTML:

  <div data-role="page" id="mainpage">
    <div data-role="header">
      <h1> My Test </h1>
    </div><!-- /header -->

    <div data-role="content">
      <div class="content-primary">
        <form id="fmain" data-ajax="false">
          <!-- Primary SSN -->

          <div data-role="none">
            <label for="ssnprimary">SSN:</label> 
            <input type="tel" name="ssnprimary" id="ssnprimary" value="" />
          </div>
          </form>
         <br />
       </div><!-- /content -->
    </div><!-- /content -->

    <div data-role="footer"
      data-theme="d"></div><!-- /footer -->
  </div><!-- /page one -->

Upvotes: 2

Views: 8881

Answers (2)

SushiGuy
SushiGuy

Reputation: 1627

If using "Masked Input plugin for jQuery" from digitalbush.com the problem is the mobile device's browser is not triggering the keydown and/or keypress events the plugin relies on. Using the built-in browser on my Android 2.3 device and typing with the digital keyboard has no effect. The cursor just sits at the start of the input box and blinks.

Upvotes: 1

user700284
user700284

Reputation: 13620

You did not include the Javascript for the jQuery plugin to mask inputs.

I tried editing your fiddle but it is not showing the result. So I created a new fiddle: http://jsfiddle.net/7MhAU/

Upvotes: 1

Related Questions