Link to home
Start Free TrialLog in
Avatar of peter Ojeda
peter Ojeda

asked on

Button Click

I have the below code to find the elapsed time between two text boxes. I have two buttons, calculate and submit. When the two text boxes are filled out, I want to be able to click calculate and have the time difference echo'd on the same page without having to leave the page or refreshing. Currently I have to click submit, then calculate, and calculate sends me to another page where I see the results. The results are correct, but the means in displaying them are not.


<form action="JobChangeTimeSheet.php" method="GET">
  Machine Stopped at:
 <input type="time" name="start_date"/>
  

End of TO:
<input type="time" name="since_start"/>  
<input type="submit"> 

Total time

<?PHP
function getTime(){
if (! empty($_GET['start_date'])){

$start_date = new DateTime($_GET['start_date']);
$since_start = $start_date->diff(new DateTime($_GET['since_start']));
echo $since_start->days.' days ';
echo $since_start->h.' hours';
echo $since_start->i.' minutes';

}
}
// delete function getTime()[ above, closing bracket, and button below to echo on page with submit
// insert time and submit then calculate works, but just calculate does not
?>
<input type="button" name="calc" onclick="document.write('<?php getTime() ?>');" value="Calculate">

</form>

 
<input type="time" name="extra1"/>  
<input type="time" name="extra2"/>  
 
 
 





 <br><br>
 
 
 
 <?PHP
if (! empty($_GET['start_date3'])){

$start_date = new DateTime($_GET['start_date3']);
$since_start = $start_date->diff(new DateTime($_GET['since_start3']));
echo $since_start->days.' days ';
echo $since_start->h.' hours';
echo $since_start->i.' minutes';

}
?>




</form>

Open in new window

Avatar of Ray Paseur
Ray Paseur
Flag of United States of America image

This question appears to be a duplicate.  It has already been answered with a tested-and-working code example here:
https://www.experts-exchange.com/questions/28981779/Time-difference.html?anchorAnswerId=41879509#a41879509

You can test the solution here:
https://iconoun.com/demo/temp_peter_ojeda_client.php

It might make more sense if you look at the application design through the understanding of client/server protocols.
https://www.experts-exchange.com/articles/11271/Understanding-Client-Server-Protocols-and-Web-Applications.html
Avatar of peter Ojeda
peter Ojeda

ASKER

Maybe I am implementing it wrong than.. I have tried testing it in a blank .php page and keep getting an error code for undefined index alpha and omega. It does work in the example though which doesn't make sense to me
ASKER CERTIFIED SOLUTION
Avatar of Ray Paseur
Ray Paseur
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Yea Ray the demo works fine for me. It is when I try to use the same code on my blank php page where I am having the issue.
ray.PNG
Have you tried using the server-side script I posted with the example?  

Please show us the calendar.php script that is identified in the error message, thanks.
<?php // demo/temp_peter_ojeda_client.php
/**
 * https://www.experts-exchange.com/questions/28981779/Time-difference.html
 */
error_reporting(E_ALL);


// CREATE OUR WEB PAGE IN HTML5 FORMAT, USING HEREDOC SYNTAX
$htm = <<<HTML5
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<style type="text/css">
/* STYLE SHEET HERE */
</style>

<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function(){
    $("#go").click(function(){
        var alpha = $("input[name=alpha]").val();
        var omega = $("input[name=omega]").val();
        $.get("temp_peter_ojeda_server.php", {alpha:alpha, omega:omega}, function(resp){
            $("input[name=lapse]").val(resp)
        });
    });
});
</script>

<title>HTML5 Page With jQuery in UTF-8 Encoding</title>
</head>
<body>

<noscript>Your browsing experience will be much better with JavaScript enabled!</noscript>

<p>Enter Start and End date/time strings, then <input id="go" type="button" value="click here" />
<br>
Start: <input name="alpha" /> End: <input name="omega" /> Elapsed Minutes: <input name="lapse" readonly />
</p>
</body>
</html>
HTML5;


// RENDER THE WEB PAGE
echo $htm;
?>
<?php // demo/temp_peter_ojeda_server.php
/**
 * https://www.experts-exchange.com/questions/28981779/Time-difference.html
 *
 * https://www.experts-exchange.com/articles/20920/Handling-Time-and-Date-in-PHP-and-MySQL-OOP-Version.html
 * Note: UTC does not observe daylight savings time, so the elapsed computations will be correct throughout the year.
 */
error_reporting(E_ALL);


// DEFINE A FUNCTION TO COMPUTE ELAPSED MINUTES
function elapsed_minutes($alpha, $omega, $zone='UTC')
{
    try
    {
        $tzone      = new DateTimeZone($zone);
        $date_alpha = new DateTime($alpha, $tzone);
        $date_omega = new DateTime($omega, $tzone);
    }
    catch(Exception $e)
    {
        return $e->getMessage();
    }
    $elapsed = (int)round( ( $date_omega->format('U') - $date_alpha->format('U') ) / 60);
    return $elapsed;
}


// USE THE FUNCTION
echo elapsed_minutes( $_GET['alpha'], $_GET['omega'] );
?>

Open in new window

I posted the code. I am just trying to use your code so I can understand how it works and hopefully implement it in my project.
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Ray, thank you very much. That was the issue. I really appreciate you taking your time and being patient with me, I am very new to php and am still learning. It works great. I will be sure to read up more on your articles. Thank you again.
Thanks for the points and thanks for using E-E!  Feel free to post lots of questions here -- we have many experts and several good articles to help you move forward.  Cheers, ~Ray