Restart the JavaScript timer by clicking a button

I am facing an issue with my asp.net page where the session timeout warning keeps appearing even if users are inputting data intermittently. Our company policy has a session timeout warning set in the Master page:

 var sessionTimeoutWarning = 45;
 sessionWarningTimer = setTimeout('SessionWarning()', sessionTimeoutWarning * 60 * 1000); 

On the aspx page, I have:

    <script type="text/javascript">
        window.onload = function () {
            $('a').filter(function (index) { return $(this).text() === "Month to Date"; }).click();

        };

        function ValidateAndShowPopup() {
            if (Page_ClientValidate('grpSubmit')) {
                SubmitF();

            }
        }

The button is inside an update panel:

 <asp:Button ID="btnSubmitReport" runat="server" Text="Submit" OnClick="btnSubmitReport_Click" ValidationGroup="grpSubmit" OnClientClick="ValidateAndShowPopup()" CssClass="btn" />

The only options seem to be either refreshing the page on button click (which is not preferred), or resetting the javascript timer on the page. Can anyone advise on how to reset the javascript timer variable on button click?

Answer №1

Did you intend to achieve this?

let countdown;

function startCountdown() {
countdown = setTimeout(function(){ 
    alert("Time's up!"); 
    }, 3000);
}

function stopCountdown() {
    clearTimeout(countdown);
    alert("Countdown Stopped"); 
}

// Begin countdown immediately
// startCountdown();
<button onclick="startCountdown()">Start Countdown</button>
<button onclick="stopCountdown()">Stop Countdown</button>

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

Issue with invoking controller action in MVC4 via AJAX

Below is the method in my controller: public JsonResult GetRights(string ROLE_ID) { var result = db.APP_RIGHTS_TO_ROLES.Where(r => r.FK_ROLE_ID.ToString() == ROLE_ID).Select(r => r.APP_RIGHTS).ToList(); return Json(re ...

What is the best way to reset the selected option in Vue.js when clicking on a (x) button?

Is there a way to create a function or button specifically for clearing select option fields? I attempted using <input type="reset" value="x" /> However, when I clear one field, all fields end up getting cleared. Should I provide my code that incl ...

Allow all images on the webpage to be easily dragged and dropped into a designated upload section

I am in the process of developing a browser extension that allows users to save images from web pages into their favorites, similar to Pinterest. The functionality involves clicking on the extension icon which adds a special field to the HTML where users c ...

What is the best way to set up a monthly node-cron job schedule?

Currently, I am utilizing the node-cron package to handle the scheduling of node-cron jobs. I am looking to schedule a job that runs at the beginning of every new month. For instance, the job should run on September 1, 2020 and then on October 1, 2020, a ...

The combination of Angular Hottowel's 'blocks.exception' and 'blocks.router' prevents the App from being displayed in the browser

After delving into Angular's fundamentals a couple of months back, I am now venturing into building a practice app that mirrors industry standards. I recently completed John Papa's Play by Play and Clean Code courses on Pluralsight, which furthe ...

Struggling with Javascript Arrays - despite my efforts, I have yet to find the correct solutions

Just getting started with arrays and could use some assistance! const array =["ron","rexona","danzial","alexander"]; Q1 - Create a function that will return an array containing items from array with more than 4 characters. ['alaska','orl ...

Searching for data in Node.js using Mongoose and dates

I'm in search of a way to execute a specific query with mongoose. In my mongodb database, I have data structured like this: "startDateTime" : ISODate("2017-03-22T00:00:00.000Z"), "endDateTime" : ISODate("2017-03-27T00:00:00.000Z"), My goal is to r ...

Encountering difficulties accessing props while invoking a component in React

In my project, I've created a component called FilterSliders using Material UI. Within this component, I passed a prop named {classes.title} by destructuring the props with const { classes }: any = this.props;. However, when I try to access this prop ...

What are the steps for testing React components when they are wrapped by ThemeProvider/withStyle?

Is there a way to properly test a component that is wrapped with withStyle, as it seems the theme object does not pass through the component. Any suggestions on best practices for achieving this? I am considering using createShallow() and dive() methods t ...

What is the method to instruct web pack to utilize an external JavaScript file URL without causing it to become stuck in the bundle

Let's tackle a simple task: I'm interested in developing a Google Chromecast receiver app (SPA). The Google Chromecast SDK (cast SDK) mandates that their framework is hosted on an external URL and creates a global cast object. What would be the ...

Using expressJS and MongoDB to create a secure login and registration system

I am interested in adding a login/register function to my expressJS API. Currently, I am only inserting the password and email into my database. I would like this function to first check if a user with this email is already in the database - if yes, then s ...

Tips for correctly linking JS and CSS resources in Node.js/Express

I have a JavaScript file and a stylesheet that I am trying to link in order to use a cipher website that I created. Here is my File Path: website/ (contains app.js/html files and package json) website/public/css (contains CSS files) website/public/scri ...

Strategies for halting the return of a JavaScript function until all AJAX requests have been completed

function processData(data) { //perform some data processing return data; } function test() { $.ajax({ 'url': api1, 'data': { 'use': "200" }, 'dataType': ' ...

Making WordPress and AJAX cooperate harmoniously

Can someone help me understand how to utilize WordPress functions in AJAX calls? I have been reading the documentation on creating plugins that utilize ajax, but I am having trouble applying that knowledge to regular pages and posts. Is there a straightfo ...

Transferring JSON data between two .NET REST APIs

Due to certain circumstances I won't elaborate on, we are working with 2 .NET Web APIs (A and B). A website sends JSON data to A via jQuery's .ajax() method, and then A needs to forward it to B. Within A, I have a model being passed as a paramet ...

Preventing redundant data from being added to the database

I have implemented the following code to insert gridview data into a database. However, I am looking to enhance it by adding a check to prevent insertion of records with duplicate name, location, education, and salary values. If all these fields match wi ...

Error message: To successfully build your ASP.net + Vue app, you must include the required output.filename in your

As a newcomer to webpack, I am currently in the process of setting up Vue within my MVC 4 application by following the guidance provided in this answer by @Bert. Upon attempting to execute webpack --watch, I encountered the following error: Error: ' ...

Error encountered with the {1}+ possessive quantifier in a JavaScript regex pattern

As I delve into learning Javascript and Express.js simultaneously, I decided to experiment with regular expressions while making a get request. To familiarize myself with regular expressions, I referred to this chart (also shown below). Greedy Reluctant ...

Customizing Attribute for Material UI TextField

I'm currently in the process of adding a custom data attribute to a TextField component like so: class TestTextField extends React.Component { componentDidMount() {console.log(this._input)} render() { return ( <TextField label= ...

Error Encountered When Trying to Import BrowserAnimationsModule in Angular 5: Unexpected Token "<"

As I try to integrate the BrowserAnimationModule into my Angular 5 project, a rather foolish error keeps popping up. Error: (SystemJS) Unexpected token < SyntaxError: Unexpected token < at eval (<anonymous>) at Object.eval ...