CODEWITHSUNDEEP
javascriptformsinputmask
telexper
telexper

Reputation: 2441

how to mask output from a form

I'm trying to mask an output that was forwarded from the form i made but doesn't seems to work .

input field from page 1

<form method="post" action="step2.php" id="form1" name="form1">  
  Enter Card Here:<input name="card"   type="text"  id="card"
  value="<?php echo $_POST["card"]; ?>"  style="width:85px;"
  class="validate[custom[card]] text-input" /> </form>

this is the code i'm using

<script> var card = "<?php echo $_POST["card"]; ?>"; var str = "";
for(var i=1; i <= card.length-4; i++) {    str += "*"; }

ecard = str + card.substr(card.length-4);
$('.ccard').appendTo('ecard'); </script>

this is where the output should appear

 <label class="ccard"></label>

on the input field the user must input 12 digit number

ex: 123456789012

then it should appear as

********9012

the first 8 digits are masked and only the last 4 digits are visible.

Upvotes: 0

Views: 1856

Answers (2)

Albin N
Albin N

Reputation: 1401

Try this:

var card = "123456789011";
var str = "";
for(var i=1; i <= card.length-4; i++) {
   str += "*";
}
ecard = str + card.substr(card.length-4);
console.log(ecard);

The card variable is your input, in this example it's already set.

Working jsfiddle-example http://jsfiddle.net/fdRTR/2/

Updated jsfiddle with label output http://jsfiddle.net/fdRTR/3/

Third update, added a button instead of onkeyupevent http://jsfiddle.net/fdRTR/4/

Please check the examples and write back if you need more help.

Upvotes: 1

Gung Foo
Gung Foo

Reputation: 13558

Try this:

var card = "123456789012";
var maskLength = card.length-4;

ecard = card.replace(card.substr(0,maskLength),Array(maskLength).join('*'));

console.log(ecard);

If you want to understand what it does:

replace(): https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/String/replace

substr(): https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/String/substr

Array(n).join(): Repeat Character N Times

Upvotes: 0

Related Questions