Replace part of input value on keypress jquery?

Question

For example I have, input type with predefined length. I want to achieve, when the input value is bigger or equal to 3, to replace that part of string[3] with '/';

<input type="text" id="number" maxlength="6" placeholder="MM/YY"/>

And here is jquery

$('#number').on('keypress',function(){
if(this.value.length <= 3) {
this.value.replace(this.value[3],'/');  
}
});

So in short when user types inside input field for example: 1234, the number 3 needs to be replaced with '/' and than the value would be 12/2017, like expiration date of credit card. Thanks in advance

kind user · Accepted Answer · 2017-02-16 22:51:16Z

4

You can try something like this. Had to change the maximum length of input's value from 6 to 7.

Try with e.g. 12/2017.

$('#number').on('keypress', function() {
  if (this.value.length >= 2) {
    this.value = this.value.slice(0, 2) + '/' + this.value.slice(3, this.value.length)
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="number" maxlength="7" placeholder="MM/YY" />

answered Feb 16, 2017 at 22:51

kind user

42k8 gold badges69 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

NemanjaD Over a year ago

Awesome Thanks :)

Jeff B Over a year ago

One small issue is that if a user types "12/", they end up with "12//". It might be good to test the value for "/" before doing the replacement.

inoabrian · Accepted Answer · 2017-02-16 22:53:24Z

0

You could try the following.

Where delimeterIndeces is where in the string you want to check and change the values. InputString is the string returned from the input tag.

let delimeterIndices = [2,5]; // "02[/]15[/]2017";
let inputString = "123152017";
let resultString = inputString.split('').map((char, index) => {
  if(delimeterIndices.indexOf(index) !== -1) {
    return '/';
  } else {
    return char;
  }
}).join('');

console.log(resultString);

answered Feb 16, 2017 at 22:53

inoabrian

3,8101 gold badge22 silver badges27 bronze badges

Collectives™ on Stack Overflow

Replace part of input value on keypress jquery?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related