How can i remove special character when I input a number e.g a Cardnumber Using C# with Javascript

Question

here is my code ...I just need to add a code for preventing a special character when the user put a number specially a card number.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">
    <title></title>
    <script type="text/javascript">
        function cc_onchange() {
            var visa_checkcard = /^4[0-9]{12}(?:[0-9]{3})?$/i;
            var master_checkcard = /^5[1-5][0-9]{14}$/i;
            var amex_checkcard = /^3[47][0-9]{13}$/i;
            var jcb_checkcard = /^(?:2131|1800|35\d{3})\d{11}$/i;
            var diners_checkcard = /^3(?:0[0-5]|[68][0-9])[0-9]{11}$/i;
            if (!visa_checkcard.test(document.getElementById('ccform_cardnumber_TB').value)) {
                if (!master_checkcard.test(document.getElementById('ccform_cardnumber_TB').value)) {
                    if (!amex_checkcard.test(document.getElementById('ccform_cardnumber_TB').value)) {
                        if (!jcb_checkcard.test(document.getElementById('ccform_cardnumber_TB').value)) {
                            if (!diners_checkcard.test(document.getElementById('ccform_cardnumber_TB').value)) {} else {
                                document.getElementById("ccform_cardtype_TB").value = "diners";
                            }
                        } else {
                            document.getElementById("ccform_cardtype_TB").value = "jcb";
                        }
                    } else {
                        document.getElementById("ccform_cardtype_TB").value = "amex";
                    }
                } else {
                    document.getElementById("ccform_cardtype_TB").value = "mastercard";
                }
            } else {
                document.getElementById("ccform_cardtype_TB").value = "visa";
            }
        }
    </script>
</head>

<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label1" runat="server" Text="Card No."></asp:Label>
            <asp:TextBox ID="ccform_cardnumber_TB" runat="server" onchange="cc_onchange();"></asp:TextBox>
            <%--<asp:DropDownList ID="ccform_cardtype_TB" runat="server"> <asp:ListItem Value="visa">VISA</asp:ListItem> <asp:ListItem Value="mastercard">Mastercard</asp:ListItem> <asp:ListItem Value="amex">American Express</asp:ListItem> <asp:ListItem Value="jcb">JCB</asp:ListItem> <asp:ListItem Value="diners">Diners</asp:ListItem> </asp:DropDownList>--%>
                <asp:Label ID="Label2" runat="server" Text="Card Type"></asp:Label>
                <asp:TextBox ID="ccform_cardtype_TB" runat="server"></asp:TextBox>
        </div>
    </form>
</body>

</html>

score 0 · Answer 1 · answered Nov 25 '15 at 04:13

If you want to check fro numbers you can chek every keypress like this: In the input-element add a onkeyup="test_key(this)" and the function

function test_key(e){
  // check the last character entered
  var val = parseInt(e.value[e.value.length-1]);
  // if it isn't a digit: alert
  if(isNaN(val)){
   alert(e.value);
  }
}

Alerts every time the user puts anything else but a digit in it.

Des Horsley · Accepted Answer · 2015-11-25T09:15:25.017

0

Rather than on every keypress, I would do the check on blur. That will also catch the issue when people paste data in rather than just when they type.

If your site is targeting modern browsers, you can set the type of the input to number, which will let the browser do some of the leg work for you (But will remove spaces):

<input type="number" />

function checkNum() {
    var x = document.getElementById("cardNum");
    if(isNaN(x.value)){
      // Throw error or alert or whatever
      x.value = "";
    }
    
}

Enter your number: <input type="text" id="cardNum" onblur="checkNum()">

edited Nov 25 '15 at 09:15

answered Nov 25 '15 at 04:31

Des Horsley

1,858
20
43

Hello, thank you for the answer code...but i have other issue ..as you can see when we click the text box the focus will trigger and when we click in any part of the browser the focus will disappear then what I want is if I put numbers with special character in the focus text box , I want the special character also automatically disappear every time the focus disappear...how should I do that..what code could possibly overcome that kind of issue. please – Akashi Nov 25 '15 at 06:18
I want Only the special character will gone not the Number.. please – Akashi Nov 25 '15 at 06:28
Where I have `x.value = ` I would use a regex to get only the numbers and valid charcters from the x.value. This post has more information: http://stackoverflow.com/questions/1183903/regex-using-javascript-to-return-just-numbers – Des Horsley Nov 25 '15 at 06:30

How can i remove special character when I input a number e.g a Cardnumber Using C# with Javascript

2 Answers2