title: How to auto format textbox inputs
body: <pre><code>&lt;tr&gt;
     &lt;td&gt;&lt;label&gt;Birthdate&lt;/label&gt;
        &lt;input type="text" placeholder="mm/dd/yyyy" name="birthdate" maxlength="10"/&gt;
     &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>Well, my code is working but I want my "input type text" to auto format like a date (html 5 input type=date) because in my Servlet I convert it to Age.
  The problem is that, if I use the "input type=date" the conversion is error so I decided to use "input type=text" and it's working. So is it possible to auto put "/" in this format "mm/dd/yyyy"? For example, if the user input 2 character an "/" will auto input etc.</p>
  
  <hr>
  
  <p>Servlet for birthdate to Age</p>
  
  <pre><code>        String birthdate = request.getParameter("birthdate");
  
  
          int monthDOB = Integer.parseInt(birthdate.substring(0, 2));
          int dayDOB = Integer.parseInt(birthdate.substring(3, 5));
          int yearDOB = Integer.parseInt(birthdate.substring(6, 10));
  
          DateFormat dateFormat = new SimpleDateFormat("MM");
          java.util.Date date = new java.util.Date();
          int thisMonth = Integer.parseInt(dateFormat.format(date));
  
          dateFormat = new SimpleDateFormat("dd");
          date = new java.util.Date();
          int thisDay = Integer.parseInt(dateFormat.format(date));
  
          dateFormat = new SimpleDateFormat("YYYY");
          date = new java.util.Date();
          int thisYear = Integer.parseInt(dateFormat.format(date));
  
          int calAge = thisYear - yearDOB;
  
          if (thisMonth &lt; monthDOB) {
              calAge = calAge - 1; 
          }
  
          if (thisMonth == monthDOB &amp;&amp; thisDay &lt; dayDOB) {
              calAge = calAge - 1;
          }
  
          String age = Integer.toString(calAge);
  </code></pre>
  
  <hr>
  
  <p>Update in the form</p>
  
  <pre><code>&lt;tr&gt;
      &lt;td&gt;&lt;label for="inputName"&gt;Birthdate&lt;/label&gt;
         &lt;input type="text" placeholder="mm/dd/yyyy" id="input_date" name="birthdate" maxlength="10"  /&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>Update in the source</p>
  
  <pre><code>&lt;script src="../scripts/formatter.js"&gt;&lt;/script&gt;
  &lt;script src="../scripts/formatter.min.js"&gt;&lt;/script&gt;
  &lt;script src="../scripts/jquery.formatter.js"&gt;&lt;/script&gt;
  &lt;script src="../scripts/jquery.formatter.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Added Script</p>
  
  <pre><code>&lt;script&gt;
       $('#input_date').formatter({
         'pattern': '{{99}}/{{99}}/{{9999}}',
         'persistent': true
       });
  &lt;/script&gt;
  </code></pre>
  
  <p>I also tried the javascript but it's not working... </p>