bassicaly i want to dynamicaly update a field on a form based on a calculation between 2 fields.

the following form is the admin form that the admin uses to edit records.
my form is as follows:

Departure Time: 10:00:00 2007-12-12
(HH:MM:SS YYYY-MM-DD) Follow Format on left

Arrival Time: 12:00:00 2007-12-12
(HH:MM:SS YYYY-MM-DD) Follow Format on left

Total Minutes: 120

Total Minutes is from the form on the frontend of the website is submitted, where it is calculated then put into the database

what i need though is the "Total Minutes" field to update to reflect the changes made to "Arrival Time" or "Departure Time"

e.g. if i change "Departure Time" to 11:00:00 2007-12-12 then "Total Minutes" changes to 60.

btw i have minimal knowledge of writing javascript.

any help would be greatly appreciated

    Here is a tutorial on calculating the difference between two dates. You could slightly modify that code and use the Date.parse() method to parse the two dates provided.

      unfortunatly without someone to guide me i can't modify javascript as i have no clue about coding in javascript, i've had a look at the code on that page and it doesnt appear to accept the date and time in the format it comes from my database, as i need a javascript that can count the minutes between 2 times like so:

      time1 = 10:00:00 2007-12-12
      time2 = 12:00:00 2007-12-12

      = 120 minutes elapsed

        Well I suppose that tutorial isn't as applicable, but you can definitely use Date.parse(). Using that method on both datetime strings, you'll get the milliseconds after 1/1/1970 for each datetime. Then, simply subtract the two numbers, and divide to get the desired unit.

          thanks Brad finnaly got this figured heres my code:

          <script type="text/javascript">
          
          var minutes = 1000 * 60;
          var hours = minutes * 60;
          var d1 = "01:00:00 08-08-2005"; <-- these will be changed to php variables
          var d2 = "08:00:00 08-08-2005"; <--|
          var e = Date.parse(d1);
          var e1 = Date.parse(d2);
          var y = e/minutes;
          var y1 = e1/minutes;
          var final = y1-y;
          document.write(final);
          </script>
          

            well not yet i have got it to work out the difference i can't work out how to get javascript to update the field and how to get javascript to dynamicaly change the var "d1" and "d2" when they are changed in the form?

              Well that would depend on what the "field" is. Is it plain text? Is it a form field?

              As for dynamically updating, you'd simply wrap the code youv'e worked out into a function and add an 'onchange' attribute to the form field that executes that function.

                bradgrafelman wrote:

                Well that would depend on what the "field" is. Is it plain text? Is it a form field?

                All 3 fields are in the same form and are all standard text boxes.

                bradgrafelman wrote:

                As for dynamically updating, you'd simply wrap the code youv'e worked out into a function and add an 'onchange' attribute to the form field that executes that function.

                i think what is confusing me is how to write a javascript IF statement as i need one to check if either of the 2 fields have been updated if not assign var "d1" or "d2" to the php default.

                  homer09001 wrote:

                  All 3 fields are in the same form and are all standard text boxes.

                  Ah, well that makes it even easier - you can update the 'total minutes' textbox like so:

                  document.formNameHere.nameOfTextBox.value = newValue;
                  homer09001 wrote:

                  i need one to check if either of the 2 fields have been updated if not assign var "d1" or "d2" to the php default

                  Can't you simply assign the textboxes' default values to your PHP value? That way you simply grab the values from the two textboxes every time you execute the JS function.

                    ok im going to do this one part at a time:

                    getting the total hours to update automatticaly:

                    heres my code:

                    <script type="text/javascript">
                    
                    var minutes = 1000 * 60;
                    var hours = minutes * 60;
                    var d1 = "01:00:00 08-08-2005";
                    var d2 = "08:00:00 08-08-2005";
                    var e = Date.parse(d1);
                    var e1 = Date.parse(d2);
                    var y = e/minutes;
                    var y1 = e1/minutes;
                    var final = y1-y;
                    document.write(final);
                    document.pirep.th.value = final;
                    </script>
                    <form name="pirep" action="process.php">
                    		Total Flight Time
                    		<br>
                    		<input type=\"text\" size\"6\" value="value" name="th">
                    		<br><br>
                    	<input type="submit">
                    </form>
                    

                    for some reason its still not changing the total hours text box?

                      Show us the HTML code you used to implement this function.

                        i've pasted the code above your last post somehow

                          homer09001 wrote:

                          for some reason its still not changing the total hours text box?

                          That's because the JS attempts to execute before the textbox even exists.

                          If you want the JS to fill in the value as well, you could wrap the JS code in a function and add window.onload = functionName; .

                            ok i've managed to get javascript to populate the textbox.

                            how do i get javascript to pass both departure time and arrival time to the function when one or the other is edited?

                              You can access the values from JavaScript just like you did to set the total time - document.formName.textBoxName.value for both.

                                You know i can't believe the answer is so simple, will give it a go when i get in from work

                                  ok so i got the script to calculate the difference corrently etc, the only problem im having is when i change a field and click out of it it doesnt reload the form with the new values instead it runs the function and outputs what i tell it to output?

                                  how do i get it to reload the form onchange?

                                  heres the code:

                                  <?
                                  //default php values to start the form!!
                                  $st = "01:00:00 08-08-2007";
                                  $lt = "02:00:00 08-08-2007";
                                  $time1 = strtotime("$st UTC"); 
                                  $time2 = strtotime("$lt UTC"); 
                                  $diff_min = round(abs($time1 - $time2) / 60);  
                                  ?> <form name="pirep" action="test.php"> Departure Time (HH:MM:SS DD-MM-YYYY) **Follow Format on left** <br> <input type="text" name="st" value="<? echo "$st"; ?>" onchange="setvars(this). submit()"><br><br> Arrival Time (HH:MM:SS DD-MM-YYYY) **Follow Format on left** <br> <input type="text" name="lt" value="<? echo "$lt"; ?>" onchange="setvars(this). submit()"><br><br> Total Flight Time <br> <input type="text" size"6" value="<? echo $diff_min; ?>" name="th"> <br><br> <input type="submit"> </form> <script type="text/javascript"> function setvars() { var minutes = 1000 * 60; var hours = minutes * 60; var d1 = document.pirep.st.value; var d2 = document.pirep.lt.value; var e = Date.parse(d1); var e1 = Date.parse(d2); var y = e/minutes; var y1 = e1/minutes; var final = y1-y; document.write(d1); document.write(d2); document.write(final); document.pirep.th.value = final; document.pirep.st.value = d1; document.pirep.lt.value = d2; self.document.location.reload(); } </script>

                                    well, assuming one of them needs to be the current system time, you instantiate a date object:

                                    var now = new Date();
                                    var mins= now.getMinutes();
                                    var secs = now.getSeconds();
                                    var yr = now.getFullYear();

                                      JPnyc wrote:

                                      well, assuming one of them needs to be the current system time, you instantiate a date object:

                                      var now = new Date();
                                      var mins= now.getMinutes();
                                      var secs = now.getSeconds();
                                      var yr = now.getFullYear();

                                      im confused??

                                      my script works to the point that it calculated the time different in minutes where im stuck now is the form isnt being reloaded with the new values as i want it to its creating a new page and printing the values of the vars?