Timing feature utilized in a Web Application

My latest project involves developing a web-based testing application using CakePHP.

Here's how it works: when a user starts a test, the exact start time is stored on the web server. Once the test is completed and the answers are submitted, the server cross-checks the submission time with the initial start time. If the total time falls within a specified margin of error (e.g. 5 minutes), the test result is deemed valid.

I've successfully implemented this functionality and currently utilize the jQuery Countdown Plugin to display a timer for the client in their browser. This same timer also triggers an automatic form submission upon expiration.

The issue arises when the page is refreshed or navigated back and forth, as this inadvertently resets the timer. Although the total test duration is tracked and verified on the server side (thus preventing users from manipulating the timer and submitting fraudulent results), I'm curious if there's a way to address or warn against this behavior, or even better, automatically submit flagged instances of tampering (which would subsequently be rejected).

I have considered incorporating AJAX for this purpose, but have been advised against doing so by management citing bandwidth concerns (which I personally doubt). Does anyone have any suggestions or workarounds?

Thank you in advance!

javascriptajaxcakephptimer

Answer №1

To determine how much time a user has left in the test, first find the current server time and the start time of the test. Calculate the difference between these two times to know how long the user has been taking the test. Subtract this duration from the total time limit of 5 minutes to get the remaining time. If the result is less than zero, it indicates that the test time has expired.

Answer №2

To facilitate the synchronization of client-side timers, it is essential to consider setting the timer on page load by the server rather than relying solely on AJAX. While AJAX can be used to request the current time upon document.ready(), unnecessary HTTP requests can be avoided by initializing this value directly from the original server-provided page.

For instance, within the ExamsController::page() method for a page like /exams/page, you can implement the following:

$this->set( 'cur_time', date( 'm-d-Y', strtotime() );

In the corresponding view template, include the following code snippet:

<?php echo $cur_time; ?>

Enclose the above snippet in a JavaScript block to assign a JS variable for initializing the jQuery counter, which can resume counting post-page load completion. This approach ensures efficient utilization of resources without unnecessary data transfer!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it possible to transfer a JSON object from Silverlight to JavaScript?

Is it possible to pass a JSON object directly from Silverlight to JavaScript, or does it have to be serialized first? ...

javascriptsilverlightjsonsilverlight-3.0

React is nowhere to be seen

index.js: import react from 'react'; import {render} from 'react-dom'; render( <h1>Hello World!</h1>, document.getElementById('root') ); package.json: { "name": "", "version": "1.0.0", "descriptio ...

javascriptreactjswebpack

The error message "The useRef React Hook cannot be invoked within a callback function" is displayed

I'm currently working on developing a scroll-to feature in Reactjs. My goal is to dynamically generate referenced IDs for various sections based on the elements within an array called 'labels'. import { useRef } from 'react'; cons ...

javascriptnode.jsreactjsreact-hooks

Tips for incorporating Bootstrap classes into a React project, setting the className attribute to an empty string

After setting up Bootstrap and Create-React-App using npm on my local machine, I proceeded to create a new React app. The first component I worked on was counter.jsx: import React, { Component } from 'react'; class Counter extends Component { ...

javascriptcssreactjsbootstrap-4

Issues with Promise execution sequence in ExpressJS Middleware

I need help creating an Express Middleware that checks if the user/password pair in the authorization header exists in a JSON file for educational purposes. I have integrated this middleware into a simple unit converter app. The issue I'm facing is t ...

javascriptnode.jsexpress

How to preselect an item in a RadioGroup

We are facing a challenge in setting a default value automatically for a RadioGroup upon page load. Despite the documentation mentioning a defaultValue property (https://material-ui.com/api/radio-group/), it does not seem to work as expected. We experimen ...

javascriptmaterial-ui

Can a website accurately identify my operating system and browser version even if my browser settings have been altered?

When using selenium to browse a website, I have modified the useragent, platform, and oscpu properties of the navigator object in my Firefox browser. Will the website be able to detect my actual operating system and browser version? ...

javascriptseleniumweb-scraping

I'm curious if there is a method in Vue.js that allows for creating a separator while utilizing v-for, much like the way `Array.join()` or FreeMarker's `<#sep>` functions operate

My goal is to create a list of <span> elements separated by commas using vue.js and v-for. Is there an easy way to achieve this in vue.js? In JavaScript, I would typically use users.join(", "). In FreeMarker templates, you can do some very interes ...

javascriptvue.jsfreemarkerv-for

What is the best way to pass a value to a modal and access it within the modal's component in Angular 8?

How can I trigger the quickViewModal to open and send an ID to be read in the modal component? Seeking assistance from anyone who can help. Below is the HTML code where the modal is being called: <div class="icon swipe-to-top" data-toggle="modal" da ...

javascripthtmlangulartypescript

Initiating a Page with Dynamic Modal Window according to Backend Exigencies

Dear experts, can you help me with a problem? I want to implement a modal window on an vb.aspx page if a specific condition from the codebehind query is true. How can I achieve this? Thank you! ...

javascripthtmlasp.netvb.netvisual-studio

Is it possible to use D3 for DOM manipulation instead of jQuery?

After experimenting with d3 recently, I noticed some similarities with jquery. Is it feasible to substitute d3 for jquery in terms of general dom management? This isn't a comparison question per se, but I'd appreciate insights on when it might b ...

javascriptjqueryhtmld3.js

Could this be a glitch in jQuery, or have I overlooked something important?

Currently, I am utilizing jquery-1.3.2 within an AJAX-driven web application. The jQuery ajax method $.post() is used for sending requests to the server. On the server-side, PHP is utilized to construct an array which is then encoded using json_encode. Su ...

phpjqueryajax

Update the class name by utilizing template literals

I'm currently in the process of mastering template literals as I have a project where I need to utilize them. However, I seem to be encountering an issue that I can't quite figure out. Here is the code that is currently working: const classes = ...

javascriptcssreactjsmaterial-uistyles

When using getStaticPaths, an error is thrown stating "TypeError: segment.replace is not a function."

I am a beginner when it comes to using Next.js's getStaticPaths and I recently encountered an error that has left me feeling lost. Below is the code I have written (using query from serverless-mysql): export async function getStaticPaths() { cons ...

javascriptreactjsnext.js

Refreshing a page in Next.js causes query parameters to disappear

I am facing an issue with routing between two components and passing data from the first to the second without sending the parameter in the URL. The problem arises when I refresh the page and the query params are lost. <p className={styles.jobname}& ...

javascriptreactjsnext.jsquery-stringdynamic-routing

Problem with reordering rows in a PHP DataTable

While attempting to retrieve data from a database table and display it in a DataTable, I encountered the following error: DataTables warning: table id=example - Invalid JSON response. To learn more about this error, refer to http://datatables.net/tn/1 ...

javascriptphpajaxdatatable

Is it possible to include an object as a parameter when making a GET request?

My parameter values are structured like this: user = {id: 1, name="tester", age="23"} Is it possible to pass the entire object as a parameter in an HTTP.GET request? If so, how can I test it using postman? ...

ajaxhttphttp-gethttp-request-parameters

Transforming complex mathematical equations into executable code using the node.js platform

Looking to implement a mathematical formula found at the following link: https://en.wikipedia.org/wiki/Necklace_(combinatorics)#Number_of_bracelets into node.js for calculating the total number of distinct ring sequences that can be created with n length ...

javascriptnode.jsmathformulabioinformatics

Move the focus to the previous input field by removing the key

I have created a phone number input with 10 fields that automatically skip to the next field when you fill in each number. However, I would like to be able to go back to the previous field if I make a mistake and need to delete a digit. How can I achieve ...

javascriptjqueryhtmlcssinput

What is the best way to alphabetically arrange an array of names in a JavaScript.map?

I am attempting to alphabetically sort an array of first names using JavaScript map function. Additionally, I aim to remove the "undefined" row from the final results: function contacts_callback(obj) { var contactinfo = obj.contacts .filter( ...

javascriptjqueryarrayssorting