title: check if input field is numeric and length with javascript
body: <p>With this java script I only allow numeric input which is fine. However I struggle to expand the function with 3 extra checks. I could use some help with java script please.</p>
  
  <p>the 3 different checks needed are:</p>
  
  <p>1) Credit Card Number = numeric and 16 in length otherwise error message</p>
  
  <p>2) Expiry date = can only be select but needs to be equal or bigger than actual  month/year</p>
  
  <p>3) CCV = Numeric and 3 in length</p>
  
  <p>This ones does block anything else then a numeric input:</p>
  
  <pre><code>&lt;script type="text/javascript" &gt;
  var specialKeys = new Array();
  specialKeys.push(8); //Backspace
  function IsNumeric(e) {
      var keyCode = e.which ? e.which : e.keyCode
      var ret = ((keyCode &gt;= 48 &amp;&amp; keyCode &lt;= 57) || specialKeys.indexOf(keyCode) != -1);
      return ret;
  }
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>for the length I tried:</strong></p>
  
  <pre><code>function LengthCheck16() {
      var str = document.getElementById("CardNumber").value;
      var n = str.length;
      document.getElementById("CardNumber").innerHTML = n;
      if ((n &gt; 16) || (n &lt; 16))
      {
      document.getElementById("lblMessage").value = "Please enter a valid credit card number";
      }
  }
  </code></pre>
  
  <p>I created a function with 2 functions in it but it did not work at all.</p>
  
  <pre><code>function CCLC16(e) {
  IsNumeric(e);
  LengthCheck16();
  }
  </code></pre>
  
  <p><strong>credit card number field</strong></p>
  
  <pre><code>&lt;td&gt; &lt;input type="text" id='CardNumber' name="EPS_CARDNUMBER" onkeypress="return IsNumeric(event);" ondrop="return false;" /&gt;&lt;/td&gt;
  </code></pre>
  
  <p>==>> if I remove the span it does not work at all (I got the idea from somewhere else)</p>
  
  <p><strong>expiry date</strong></p>
  
  <pre><code>  &lt;td style="width: 130px"&gt; &lt;asp:Label ID="Label3" runat="server" Text="Expiry: "&gt; &lt;/asp:Label&gt;&lt;/td&gt;
           &lt;td&gt; &lt;%--     Expiry Month/Year: &lt;select name="EPS_EXPIRYMONTH"&gt;--%&gt;
                  &lt;select name="EPS_EXPIRYMONTH"&gt;
                             &lt;option value="01"&gt;01&lt;/option&gt;
                      &lt;option value="02"&gt;02&lt;/option&gt;
                      &lt;option value="03"&gt;03&lt;/option&gt;
                      &lt;option value="04"&gt;04&lt;/option&gt;
                      &lt;option value="05"&gt;05&lt;/option&gt;
                      &lt;option value="06"&gt;06&lt;/option&gt;
                      &lt;option value="07"&gt;07&lt;/option&gt;
                      &lt;option value="08"&gt;08&lt;/option&gt;
                      &lt;option value="09"&gt;09&lt;/option&gt;
                      &lt;option value="10"&gt;10&lt;/option&gt;
                      &lt;option value="11"&gt;11&lt;/option&gt;
                      &lt;option value="12"&gt;12&lt;/option&gt;
                  &lt;/select&gt;
              &lt;%--     &lt;input type="text" name="EPS_EXPIRYYEAR" /&gt;--%&gt;
                  &lt;select name="EPS_EXPIRYYEAR"&gt;
                      &lt;option value="2014"&gt;2014&lt;/option&gt;
                      &lt;option value="2015"&gt;2015&lt;/option&gt;
                      &lt;option value="2016"&gt;2016&lt;/option&gt;
                      &lt;option value="2017"&gt;2017&lt;/option&gt;
                      &lt;option value="2018"&gt;2018&lt;/option&gt;
                      &lt;option value="2019"&gt;2019&lt;/option&gt;
                      &lt;option value="2020"&gt;2020&lt;/option&gt;
                      &lt;option value="2021"&gt;2021&lt;/option&gt;
                      &lt;option value="2022"&gt;2022&lt;/option&gt;
                      &lt;option value="2023"&gt;2023&lt;/option&gt;
                      &lt;option value="2024"&gt;2024&lt;/option&gt;
                      &lt;option value="2025"&gt;2025&lt;/option&gt;
                      &lt;option value="2026"&gt;2026&lt;/option&gt;
                      &lt;option value="2027"&gt;2027&lt;/option&gt;
                      &lt;option value="2028"&gt;2028&lt;/option&gt;
                      &lt;option value="2029"&gt;2029&lt;/option&gt;
                      &lt;option value="2030"&gt;2030&lt;/option&gt;
                  &lt;/select&gt;&lt;/td&gt;
  </code></pre>
  
  <p><strong>CCV</strong></p>
  
  <pre><code>&lt;td&gt;
                      &lt;input type="text" name="EPS_CCV" style="width: 41px" onkeypress="return IsNumeric(event);" ondrop="return false;" /&gt;&lt;/td&gt;
  </code></pre>
  
  <p>If someone can show me how to write this better even for only one function I appreciate the feedback. </p>