Time picker in input text box

naveendk.55 · 12-27-2011, 12:29 PM

Hi,

I'm trying to display a time clock in input text box. The time should display in Time utilization box after clicking on START BUTTON.

I tried the below code and it is not starting the time. However, I tried the javascript individually and it worked. Any help?

PHP Code:


			


<script type="text/javascript">

            var seconds = 0;

            var minutes = 0;

            var hours   = 0;

    

            function zeroPad(time) {

                var numZeropad = time + '';

                while(numZeropad.length < 2) {

                    numZeropad = "0" + numZeropad;

                }

                return numZeropad;

            }



            function countSecs() {

                seconds++;



                if (seconds > 59) {

                    minutes++;

                    seconds = 0;

                }

                if (minutes > 59)

                {

                    hours++

                    minutes = 0;

                                

                }

                document.getElementById("time_utilization").innerHTML = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds);

            }



            function startTimer() {

                action = window.setInterval(countSecs,1000);

            }



        </script>



    </head>

    <body>

<?php include("header.php"); ?>



<div class="art-content-layout">

<div class="art-content-layout-row">

<div class="art-layout-cell art-content">

<div class="art-post">

<div class="art-post-body">

<div class="art-post-inner art-article">



<form name="tracker" method="post" action="processor.php" onsubmit="return formCheck(this);">



<ul>



<li class="mainForm" id="fieldBox_8">

<label class="formFieldQuestion">Start Time&nbsp;*</label><input readonly class=mainForm type=text name=start_time id=start_time size='30' value=''> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<input type="button" id="start1_time" style="width: 100px" Value="Start Time" onClick="startTimer()"></li>





<li class="mainForm" id="fieldBox_12">

<label class="formFieldQuestion">Time Utilization</label><input class=mainForm type=text  name="time_utilization" id="time_utilization" size='8' value='00:00:00' ></li>

<br /> <br />

<li class="mainForm">

<input id="saveForm" class="mainForm" type="submit" value="Submit"  style="width : 100px"/>

   </li>

</form>

I am getting "Unknown Runtime Error at line 43". However, code has below line at link 43:

Code:

                document.getElementById("time_utilization").innerHTML = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds);

needsomehelp · 12-27-2011, 02:48 PM

Change line 43 to this, note that all I have changed is the innerHTML to value

Code:

document.getElementById('time_utilization').value = zeroPad(hours) + ':' + zeroPad(minutes) + ':' + zeroPad(seconds);