Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Sep 2011
    Thanked 0 Times in 0 Posts

    How to insert colon automatically after entering hours in hh:mm format


    I had a requirement in javascript.If I enter time as 12 it should automatically insert colon after hours and shoud allow user to enter minutes.

    First enter hours 12

    while we are ready to insert minutes it should automatically insert colon as well as minutes.

    function autoTabTimes(input, len) {

    if (input.value.length == 2) {
    if (input.value.indexOf(":") == -1) {
    input.value = input.value + ":";
    var str = input.value.split(":");
    if (str[0].length == 1) {
    input.value = "0" + str[0];

    if (input.value.length >= len) {
    input.value = input.value.slice(0, len);
    input.form[(getIndex(input) + 1)].focus();


    return true;

    The above code is working but it is not allowing user to edit the time back space is not working.
    Last edited by sandeeprocks444; 09-30-2011 at 11:58 AM.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    London, England
    Thanked 2,562 Times in 2,540 Posts
    Double posted at

    If you post in multiple forums you will find that you may not get an answer in any of them. People do not want to waste time answering a question when it has perhaps already been answered elsewhere.
    There are few things in forums more irritating than taking the time to unsnarl someone's markup, javascript and css, figure out the fix, and post it only to find you've wasted your time because a duplicate post in another forum has already been answered.

    Back space works just fine but your code in effect cancels it.

    Try this instead:-

    <script type = "text/javascript">
    function autoTabTimes(input) {
    var len = input.value.length;
    if (len<3) {
    alert ("Invalid time - re-enter it");
    input.value = "";
    return false;
    if (len==3){
    input.value ="0" + input.value;
    var final = input.value.split("");
    var h = Number(final[0] + final[1]);
    var m = Number(final[2] + final[3]);
    if (h <0 || h >23 || m <0 || m >59) {
    alert ("Invalid time - re-enter it");
    input.value = "";
    return false;
    var f = final[0]+final[1]+":"+final[2]+final[3];
    input.value = f;
    function strip(which) {
    var x = which.value;
    x = x.replace(/[^0-9]/g,"");  // allow only digits
    which.value = x;
    <input type = "text" maxlength=5  onkeyup = "strip(this)" ; onblur = "autoTabTimes(this)">
    Quizmaster: Three of the four Olympic throwing events are the discus, shot put and the hammer. What is the fourth?
    Contestant: Long jump.
    Last edited by Philip M; 09-30-2011 at 05:54 PM. Reason: Improved

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.


    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts