1

I've seen a bunch of questions that are similar to this but not quite what I am looking for... apologies if I've missed one.

So, I have a series of number inputs for an HTML app that runs in an iOS UIWebView and mobile Safari. They need to accept only numbers and not special characters or letters and must validate to a max value.

I'm currently using e.which to validate, which is working most of the time, but of course a bunch of punctuation characters (despite being different keys on iOS) report the same keycode as number keys, and I'm having trouble figuring out if I can just not allow them to be entered vs stripping them out after they've displayed in the input field.

(Irrelevant code and structure has been removed.)

<input type="number" id="input-patients" value="1600" max="10000" min="0" />
<input type="number" id="input-pct_dropout" value="16" max="100" min="0" />
<input type="number" id="input-annual_dollars" value="275" max="500" min="0" />

JavaScript:

$('.input').on('keydown', function(e){

    var charCode = (e.which) ? e.which : event.keyCode;
    if (charCode > 47 && charCode < 59 || charCode == 8){
    // here a bunch of other stuff happens
       return true;
    }
    else{
       return false;
    }
});

Can I check for special characters without having them display in the input fields first and then stripping them from the string?

Thanks in advance.

ruhee
  • 73
  • 3
  • 7
  • `` can give you a nicer number pad. – Serg Chernata May 21 '14 at 18:36
  • Sorry, should have clarified it's iPad only (it's a proprietary app viewer) ... `tel` doesn't bring up a different keypad on iPad, does it? Was under the impression that was iPhone specific but I've rarely used it. – ruhee May 21 '14 at 18:43
  • I'll give it a shot when I get home. If you're using the JS snippet that's currently in this post, what is the issue? It doesn't work the way you want it to? – Serg Chernata May 21 '14 at 19:02
  • I took it for a spin using `tel` and didn't see a difference in keyboard, just the usual iPad numbers & punctuation. And yeah, this works really well to restrict everything but punctuation that is usually found on the number keys—it won't reject !@#$%^&*() because they report the same keycodes as the number keys. – ruhee May 21 '14 at 19:19
  • I see. What you might have to do is strip out individual characters on string level for the input, instead of trying to prevent their input completely. Look at [this answer](http://stackoverflow.com/questions/4374822/javascript-regexp-remove-all-special-characters). What you have to do is just filter everything BUT numbers. That example filters everything BUT letters. – Serg Chernata May 21 '14 at 19:27
  • Oh, man, I didn't think about it that way at all. Thanks, this is helpful—I will give that a try instead. – ruhee May 22 '14 at 17:25

1 Answers1

0

onkeyup of selected input element write event: get value from input box, then check is number? (if yes then isNAN(val) return false and stop further processing), else go for next execution which call recursive function turnToInt and set value of this input box with valid INT returned from that function;

turnToInt function : check is valid number (if yes return that number or remove last character from val and call itself for further validation finally return valid INT number);

$(".select_object").keyup(function() {
      (val = $(this).val()) && isNaN(val) && $(this).val(turnToInt(val))
    });

function turnToInt(val) {
    return isNaN(val) ? turnToInt(val.substr(0,val.length-1)) : val;
  }
sanjay chaudhary
  • 71
  • 8