Time Sheet Date and Time in and Out

[Accountability]

Trying to capture Date/Time In and Date/Time Out  for an employee time sheet. (Sampling code for date time in only, once this works I will use same method for Date/Time Out).
I will in the end hide @Defined_Time_In but am leaving it Text255 so I can make see if the code is working in real time.

 @Defined_Time_In = Date Field
 @cbParm Virtual 1 - 4 are Text255  (V1 = Date, V2=Hour, V3=Minute and V4=Second)
 @cbParmVirtual5 is a custom Dropdown (AM or PM)

<script>

  function concatenate()
 {
  
   var One = document.getElementById("InsertRecordcbParmVirtual1").value;
   var Two = document.getElementById("InsertRecordcbParmVirtual2").value;
   var Three = document.getElementById("InsertRecordcbParmVirtual3").value;
   var Four = document.getElementById("InsertRecordcbParmVirtual4").value;
   var Five = document.getElementsById("InsertRecordcbParmVirtual5").value;
   var link  =  One + " " + Two +":" + Three + ":"+Four + " "+ Five;
   document.getElementById("InsertRecordDefined_Time_In").value = link;
 }

document.getElementById("InsertRecordcbParmVirtual1").onkeyup = concatenate;
document.getElementById("InsertRecordcbParmVirtual2").onkeyup = concatenate;
document.getElementById("InsertRecordcbParmVirtual3").onkeyup = concatenate;
document.getElementById("InsertRecordcbParmVirtual4").onkeyup = concatenate;
document.getElementsById("InsertRecordcbParmVirtual5").onkeyup = concatenate;

 </script>

If I can't get the above to work I will probably use https://forums.caspio.com/topic/5069-time-sheet/ . I would really like to see onchange or onkeyup.

Thanks in advance for any help !

 

[douvega]

I think you have some typos in your script. InsertRecordcbParmVirtual1 is incorrect, cbParamVirtual1  is the correct ID, virutal fields are not defined by Insert or Edit prefixes.

 

Also, in dropdown fields, you can not have a keyup action since there is no such action, it should be onchange. Besides, to get dropdown values, you have a collection of objects, so you can not reference to them as you would do with normal text fields.

 

To get dropdown values you should use:

 

var e = document.getElementById("exactFieldID");

var ddValue = e.options[e.selectedIndex].value;

 

To track the onchange event:

 

document.getElementById("exactFieldID").onchange = yourFunctionName;

 

Hope it helps.

[Accountability]

Once again DouVega, can't thank you enough. Works perfectly.  

For anyone else, thanks to DouVega here is the working iteration:

<script>

  function concatenate()
 {
  
   var One = document.getElementById("cbParamVirtual1").value;
   var Two = document.getElementById("cbParamVirtual2").value;
   var Three = document.getElementById("cbParamVirtual3").value;
   var Four = document.getElementById("cbParamVirtual4").value;
   var Five = document.getElementById("cbParamVirtual5").value;

   var link  =  One + " " + Two +":" + Three + ":"+Four + " "+Five;
   document.getElementById("InsertRecordDefined_Time_In").value = link;
 }

document.getElementById("cbParamVirtual1").onchange = concatenate;
document.getElementById("cbParamVirtual2").onchange = concatenate;
document.getElementById("cbParamVirtual3").onchange = concatenate;
document.getElementById("cbParamVirtual4").onchange = concatenate;
document.getElementById("cbParamVirtual5").onchange = concatenate;

 </script>

[Accountability]

Please see attached Screenshot.
Note: this is only the IN date and time. Once this all works as desired, I will do the exact same thing for Out time and date.

Ok "A" works great. I can change any of the drop-downs and the "Defined_Time_In" is properly populated in real time (onchange).  Now I would like to be able to use the "B" "Defined Work Schedule" Drop-down and be able for that to populate the same fields.
In other words, would like to incorporate "B" the "Defined Work Schedule" Drop-down to auto populate Virtual2(Hour), Virtual3(Minutes), Virtual4(Seconds) and Virtual5(AM/PM). 

If this is possible and the  "Defined Work Schedule" Dropdown is able to populate V2-V5, still need for the user to change any of these individually with their prospective dropdowns. In other words still have the functionality of the JScript before introducing the new "Defined Work Schedule" Dropdown. 

Thanks You
 

[Accountability]

For future reference here is the JS for both date and time In and date and time Out.

I do have one question, is there a way to prevent the submission if someone chooses an OUT date and time which is less than the IN date and time. Just a little precaution. I was thinking if we could put an if statement which is in essence >

Have Date Out required : IF Defined_Date_Out is Less than Defined_Date_In > reset Defined_Date_Out to Blank. Since it is required it would stop the submission. I am not sure of the syntax but I think the logic would work.

As always thanks for any help.

I have done a lot of testing and the following seems to work every time.

<div id="con1">
<script>

  function concatenate1()
 {
  
   var One = document.getElementById("cbParamVirtual1").value;
   var Two = document.getElementById("cbParamVirtual2").value;
   var Three = document.getElementById("cbParamVirtual3").value;
   var Four = document.getElementById("cbParamVirtual4").value;
   var Five = document.getElementById("cbParamVirtual5").value;
 
  var link  =  One + " " + Two +":" + Three + ":"+Four + " "+Five;
   document.getElementById("InsertRecordDefined_Time_In").value = link;

 }

document.getElementById("cbParamVirtual5").onchange = concatenate1;
document.getElementById("cbParamVirtual1").onchange = concatenate1;
document.getElementById("cbParamVirtual2").onchange = concatenate1;
document.getElementById("cbParamVirtual3").onchange = concatenate1;
document.getElementById("cbParamVirtual4").onchange = concatenate1;

 </script>
</div>

<div id="con2">
<script>

  function concatenate2()
 {
   var Six = document.getElementById("cbParamVirtual6").value;
   var Seven = document.getElementById("cbParamVirtual7").value;
   var Eight = document.getElementById("cbParamVirtual8").value;
   var Nine = document.getElementById("cbParamVirtual9").value;
   var Ten = document.getElementById("cbParamVirtual10").value;
  
   var linkout  =  Six + " " + Seven +":" + Eight + ":"+Nine + " "+Ten;
   document.getElementById("InsertRecordDefined_Time_Out").value = linkout;
 }
document.getElementById("cbParamVirtual10").onchange = concatenate2;
document.getElementById("cbParamVirtual6").onchange = concatenate2;
document.getElementById("cbParamVirtual7").onchange = concatenate2;
document.getElementById("cbParamVirtual8").onchange = concatenate2;
document.getElementById("cbParamVirtual9").onchange = concatenate2;

 </script>

 </div>

[Accountability]

Please See Above attachment. In attempting to integrate drop-down values so I could use both the working code (Above) and the drop-down. I unsuccessfully tried the following. If I can find a way for this code to work I will apply the same for every Work Schedule in the drop-down). Any advise would be appreciated.

Code Snippet

  var shift = document.getElementById("Defined_Work_Schedule").value;
   var One = document.getElementById("cbParamVirtual1").value;    
   var Two = document.getElementById("cbParamVirtual2").value;
           if (shift == "7:00 AM to 7:00 PM")
            var Two="07";
   var Three = document.getElementById("cbParamVirtual3").value;
             if (shift == "7:00 AM to 7:00 PM")
            var Three="00";

etc.....

[Kurumi]

Hi - For Time only fields, you can check this new forum post: