Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Capture sytem time when a user clicks on a button on a webform.

Posted on 2016-09-09
7
Medium Priority
?
62 Views
Last Modified: 2016-10-03
thank you all in advance for your help. We have a webform that currently sends data to our MySQL server in the cloud. The webform uses PHP to make the connection. We would like the user to click a button at the top of the form as they start submitting data and then hit another button at the end of the form when they are done.

If the form can capture the start time and the end time, we can have sql do the math and give us a calculated elapsed time.

Thus, how can we have the system time sent to the MySQL db via a form button.

thank you again in advance!
0
Comment
Question by:Victor Nares
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
  • 2
7 Comments
 
LVL 44

Accepted Solution

by:
zephyr_hex (Megan) earned 1000 total points (awarded by participants)
ID: 41792011
It might be better to send the start and end times with the form submission, so you have all of the data at the same time.

To do this, add two hidden fields to your form.  One field will be set with the start time and the other with the end time.  You can tie click events to those buttons, which, when triggered, will capture the time and update the corresponding hidden input.  The values can then be retrieved from the hidden inputs when the form is posted.

Here is a simple example:  Fiddle Demo

And the code from that demo:

HTML
<input type="hidden" id="start" name="start" value="">
<input type="hidden" id="end" name="end" value="">
<input type="button" id="myButton" value="Start">
<span id="result"></span>

Open in new window


jQuery
$('#myButton').click(function() {
  var d = new Date();
  var time = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
  if ($(this).val() === "Start") {
    $('#start').val(time);
    $(this).val("End");
  } else if ($(this).val() === "End") {
    $('#end').val(time);
    $(this).val("Done");
    $('#result').text("Start time: " + $('#start').val() + " and End time: " + $('#end').val());
  }
});

Open in new window

1
 
LVL 59

Expert Comment

by:Julian Hansen
ID: 41792557
Why rely on a user clicking a button?
Why not record the time when they hit the form page and the time when you get a submit? That way you keep it on the server outside of the user's ability to interfere with the results?
0
 

Author Comment

by:Victor Nares
ID: 41794889
Julian,

that would work great as well. However on this form, I'd like the user to "time" themselves. the webform is being filled as an operator completes the tasks. We want to capture how long the operator took to complete the tasks.
0
Plesk WordPress Toolkit

Plesk's WordPress Toolkit allows server administrators, resellers and customers to manage their WordPress instances, enabling a variety of development workflows for WordPress admins of all skill levels, from beginners to pros.

See why 2/3 of Plesk servers use it.

 
LVL 59

Assisted Solution

by:Julian Hansen
Julian Hansen earned 1000 total points (awarded by participants)
ID: 41795055
I understand - we use this on our telephonic surveys to monitor performance of the operators. They dial a number, start the survey, ask the questions.
We are able to time every stage of the process and bring up profiles by operator down to the question level.
Not sure what the benefit is of them actually hitting a button?
What if they start filling out the form and forget to hit the button? You would need to lock the form until they pressed the button which could simply trigger a process on the server that captures the time this could be as simple as
$.get('timer.php');

Open in new window

When the form is submitted that is the end of the time.
However, I still think that it makes more sense to capture the time when the form is requested - or to do both.

Having said that here is a sample
HTML (php file)
<?php
session_start();
$_SESSION['start'] = time();
?>
    <button class="btn btn-success" id="start">Start</button> Time: <span id="timer"></span>
    <div class="row">
      <div class="col-sm-6 col-sm-offset-3">
        <form action="t1580_complete.php" method="post" class="form-horizontal">
          <div class="form-group">
            <label for="firstname" class="control-label col-sm-3">First name</label>
            <div class="col-sm-9">
              <input type="text" name="firstname" id="firstname" class="form-control" disabled/>
            </div>
          </div>
          <div class="form-group">
            <label for="surname" class="control-label col-sm-3">Last name</label>
            <div class="col-sm-9">
              <input type="text" name="surname" id="surname" class="form-control" disabled />
            </div>
          </div>
          <div class="form-group">
            <label for="email" class="control-label col-sm-3">Email</label>
            <div class="col-sm-9">
              <input type="email" name="email" id="email" class="form-control" disabled />
            </div>
          </div>
          <div class="form-group text-right">
            <div class="col-sm-12">
              <button class="btn btn-default" disabled>Submit</button>
            </div>
          </div>
        </form>
      </div>
    </div>

Open in new window

jQuery for main file
$(function() {
   $('#start').click(function() {
       $.get('t1580_timer.php');
       $('input, button').prop('disabled', false);
     var start = (new Date()).getTime() / 1000;
     setInterval(function() {
     var now = (new Date()).getTime() / 1000;
     $('#timer').html(parseInt(now-start));
     }, 1000);
   });
});

Open in new window

PHP Start Timer script
<?php
session_start();
$_SESSION['timerstart'] = time();

Open in new window

PHP Post script
<?php
session_start();
$complete = time();

echo "Total time: " . ($complete - $_SESSION['start']) . " seconds<br/>";
echo "Operator time: "  . ($complete - $_SESSION['timerstart']) . " seconds<br/>";
$_SESSION = array();
session_destroy();

Open in new window

Working sample here
0
 

Author Comment

by:Victor Nares
ID: 41798186
zephyr_hex your code and example were very helpful and worked great!

Julian, you php code worked great as well! we have applications where that will work for sure.

thank you both. the information was key!
0
 
LVL 44

Expert Comment

by:zephyr_hex (Megan)
ID: 41798875
@Victor - if your question has been answered, you can close it out and identify the solutions that answered your question.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

There’s a good reason for why it’s called a homepage – it closely resembles that of a physical house and the only real difference is that it’s online. Your website’s homepage is where people come to visit you. It’s the family room of your website wh…
Originally, this post was published on Monitis Blog, you can check it here . It goes without saying that technology has transformed society and the very nature of how we live, work, and communicate in ways that would’ve been incomprehensible 5 ye…
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question