"Displaying a popup message prompting users to refresh the page after clicking

I need to implement a feature where the page refreshes only after the user clicks the "OK" button on a dialog box that appears once a process is completed.

The issue I'm facing is that in my current code, the page refreshes immediately after the process completes, without waiting for user interaction.

Below is the code snippet I am currently working with:

$.ajax({
    type: "POST",
    url: wsurl + "BackendRequest",
    data: '{ sDomain : "' + domain + '", sUserName : "' + username '"}',

    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data) {
        document.getElementById('btnGenerate').disabled = true;
        showDialogPopup('Generate Request', data.d);
        //window.location.reload();
    },
    error: function (objXMLHttpRequest, textStatus, errorThrown) {
        showDialogPopup('Generate Request', data.d);
        //window.location.reload();
    }
});

The challenge is to find a way to trigger the page refresh only when the user interacts with the dialog box and clicks the "OK" button in the showDialogPopup method.

javascriptc#asp.netajaxfunction

Answer №1

In order to make the "Ok" button functional, you need to create an onclick event for it. Here is a sample code snippet that you can use:

<a onclick="OpenModal()">Open Modal</a>

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">
        <button onclick="ReloadPage()">Ok</button>
    </div>
</div>
</div>

<script>
//Function to open the modal
function OpenModal() {
    $("#myModal").modal('show');
}

//Function to reload the page
function ReloadPage() {
    window.location.reload();
}

Answer №2

If you're looking to utilize a confirm popup modal that returns a boolean value, here's how you can do it:

 success: function (response) {
    const isConfirmed = confirm('Generate Request');

   if(isConfirmed) {
     console.log('User clicked the OK button - Data:', response.data)
     window.location.reload();
   }
}

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

Using VB.NET to run JavaScript through Selenium's ChromeDriver

I've tried various methods in C# but I can't seem to get them working in VB.NET. It's possible that I'm not initializing it correctly. My goal is to run javascript on a loaded URL using the chromedriver. This is what my code looks like ...

javascriptvb.netselenium

The code encountered a parsing error at 11:1, due to the presence of

I'm having trouble with this code. I've searched for answers but haven't found any solutions. Here is the error message: 11:1 error Parsing error: Unexpected token } ✖ 1 problem (1 error, 0 warnings) npm ERR! code ELIFECYCLE npm ERR! ...

javascriptnode.jsnpm

What is the process of combining JS functions with PHP echo in code?

I am currently working on creating a popout menu for an array of values that are being displayed from the database. The goal is to show the corresponding popout menu when the svg is clicked, but I am running into an issue where it only works for the first ...

javascriptphphtml

Having difficulties uploading a file with an AutoIT script

I have been searching extensively without success. My problem is that I've written an AutoIT script that works perfectly when executed independently from C# or Java code. Here's the script: WinWaitActive("File Upload") Send("C:\Users\f ...

javac#seleniumfile-uploadautoit

Reorganizing the position of the HTML form method for processing PHP $_POST data

Content goes here ...

javascriptphphtmlcss

Unable to fetch css file in Node.js

I am currently in the process of learning Node.js, but I have encountered a small issue with retrieving data from a css file. Interestingly, when I directly add the data to the index file's code, it seems to work perfectly. Let me share the relevant ...

javascripthtmlcssnode.js

Redux/React project bundle

I am currently attempting to incorporate the package https://www.npmjs.com/package/is-url into my React/Redux project, but I'm unsure about how to go about importing it. Are there any other ES6-compatible installation options that you would recommend ...

javascriptreactjsnpmredux

Attempting to create a child process within the renderer by triggering it with a button click

I'm currently developing an electron application where I am attempting to initiate a child node process (specifically to run a Discord.JS bot). Below is the code snippet in question: index.html: <tr> <th class="title-bar-cell" ...

javascripthtmlnode.jselectron

Failure to load image logo when refreshing the page

There's something peculiar happening in my App.vue. Imagine I have a route link, let's say it's localhost/tools or any similar route. The logo image will display on this route. Take a look at the image here https://i.stack.imgur.com/6HaXI.p ...

javascriptvue.jstemplates

Unable to locate child after adding element to HTML

I have been attempting to add a child element to my HTML document, and although I can see it in the source code, it doesn't display on the screen as expected. It's quite baffling. Here is the HTML code snippet: <!DOCTYPE html> <html> ...

javascripthtml

I'm experiencing a connection issue despite using the same call file. Why could this be happening?

Here is my situation: I have developed a WebSocket Server using Node.js within an environment primarily based on Laravel. To mimic the functionality of Laravel's .env file, I have incorporated the dotenv package. Recently, I came across a strange obs ...

javascriptnode.jsenvironment-variables

The jQuery mouseout functionality seems to be malfunctioning and not responding as expected

I am currently developing a slider that displays details when the mouse hovers over the logo, and hides the details when the mouse moves away from the parent div. jQuery('.st_inner img').mouseover(function() { jQuery(this).parent().siblings( ...

javascriptjquerywordpress

The issue of a modal window opening multiple times within the same query instance

It seems like I need to go back and revise this code. Let me explain my issue. I have a query that displays a list of "offers" below Categories. When these links are clicked, they open in a modal box using jQuery. Everything is functioning properly! Howe ...

phpjqueryajaxmodal-dialog

What is the best way to implement form fields that have varying validation patterns based on different conditions?

Currently, my focus is on developing a form that prompts the user to choose between "USA" or "International" via radio buttons. The input field for telephone numbers should then adapt its requirements based on the selected country - either a 10-digit US nu ...

javascripthtmlformsvalidation

Tips for accessing Ajax data within Ember computed property

I'm facing a challenge with returning data from an Ajax call in a computed property. Despite being aware of the asynchronous nature, I am unable to figure out how to do it due to the specific requirement of returning the data in an array format with o ...

javascriptjqueryajaxember.js

"Implementing Vue mousemove functionality only when the mouse button is pressed

Is it possible to initiate a mouse movement only after the element has been clicked first? I am exploring this functionality for an audio player timeline. .player__time--bar(@mousedown="setNewCurrentPosition($event)") .slider(role="slider" aria-valuem ...

javascriptvue.jsvuejs2mousedown

Combining a form and table on a single webpage, I am curious how to utilize the form to update the table effectively using Express and Node.js

Seeking guidance in website development as I face a particular challenge. I aim to create a dynamic search page for a website. The form should allow users to select a location or category, with the same page updating with relevant results. Despite succes ...

javascriptnode.jsexpress

including a code snippet within a dropdown menu or embedding it in a clickable button

Hey there, my name is Wouter Sanders and I am currently learning to code! I recently finished creating a RAL color picker for a project I'm working on. The only issue I've run into is trying to embed the code in a menu or button so that it doesn ...

javascriptjqueryhtmlcss

jQuery does not provide the reference of a basic canvas element

I'm having trouble with a simple initialization function that is supposed to create a canvas element in the body and save its reference in a variable. No matter what I try, jQuery doesn't seem to want to return the reference. I attempted refere ...

javascriptjqueryhtml

What is the best way to inform a web server when a user exits their browser in an ASP.NET environment?

I am currently working on a relay chat application that is split into two sections. On the right pane, users can see chat responses (implemented using an ASP.NET Multiline Label control within an update panel). This means that when a user types a response ...

c#asp.netajax