Dynamically showing a div using JavaScript and AJAX after changing the window location

After successfully fetching data from the server through AJAX, I am redirecting to the same screen/URL. Is it possible to show/display a div after redirecting using jQuery?

$.ajax({
    type: "POST",
    url: action,
    data: form_data,
    success: function (response) {
        if (response.status == 'undone') {

            $('#paypal_email_error').html(response.errors.paypal_email);
            $('.er_msg').show();
        }
        if (response.status == 'done') {
            window.location = '/accounts/email/';
            $('.show_this').show();
        }

    }
    });
});

template.html

<div class="alert alert-error hide show_this">
    <li>Saved Email successfully </li>
</div>

Answer №1

If you want to pass information during a redirection, one method is to add a query string to the URL. Since this results in a new server request, the current context cannot be maintained. Therefore, an alternative way is needed to transmit the message.

Here is an example:

window.location = '/orders/status/?confirmed=true';

Subsequently, the relevant processing can be done on the server side. If the parameter "confirmed" is present and set to true, display the corresponding HTML content or execute the following script:

$('.display_confirmation').show();

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

css boxShadow merger

Looking to create a sleek horizontal navigation bar using an unordered list with list items representing each element: To ensure the elements fit perfectly within the bar, I set the width of each at 25% and added a box-shadow for a border. Using a traditi ...

Updating the content of a div when the mouse hovers over it

Looking for some help here - I have a few divs with paragraphs of text inside. My goal is to change the text in each div when it's being hovered over. I know this can be done using JavaScript (jquery perhaps?), but my coding skills are pretty basic. A ...

The xmlHttp.getResponseHeader method is currently ineffective with CORS

My ASP.NET WCF on .NET 4 is used for user authentication. When submitting a username and password, an HTTP Header should be returned with the authentication cookie included. The process works correctly when accessing a locally hosted test page. However, I ...

"Encountered an error while trying to access properties that

Struggling to create a practice menu with the functionality of making elements appear and disappear on click? If you are encountering issues with a class named "option" not working as expected, you are not alone. Clicking on nested objects like images or i ...

Webpack configuration for asynchronous loading

I'm having trouble making this work. Can someone please assist? :) (According to the documentation, webpack is capable of handling Promises) Here is what works for me: var compiler = webpack(webpackConfig) However, when I try using a promise, I en ...

Encountered an issue with md-autocomplete: Attempting to read property 'success' of an undefined element

I encountered an issue while using Material Angular framework and md-autocomplete. The error message I receive is: Cannot read property 'success' of undefined. Below is the snippet of my code: /*My app.js*/ var app = angular.module('app&apo ...

A runtime error occurred in ScriptResource.axd at line var f = ($telerik.isIE) ? document.createElement('<iframe name="' + this.get_id() + '">');

I am encountering an error during runtime in the ScriptResource.axd file, which is causing a major issue for me as I am unable to modify the code directly to fix it. The error seems to be specific to this line: ScriptResource.axd runtime error on line var ...

The issue with using useState on arrays is that it is not functioning properly with React Hooks

const [LatestNews, setLatestNews] = useState([]); useEffect(() => { async function fetchLatestData() { const result = await database.collection('latestnews').get(); result.docs.forEach(doc => ...

In certain cases, Crossdomain jQuery.ajax may experience issues in Firefox 8, yet it functions correctly in Chrome and IE

I have encountered an issue with a script that interacts with my Ruby on Rails application through jQuery 1.7.1. The script functions properly in Chrome and IE9, but fails to work in Firefox. Below is the script in question: Informer= { getData: functi ...

What is so surprising about how a div moves and changes position?

What causes images and div elements to appear jerky when in motion? <div>*</div> $(function() { var fps = 30; var a = 0; draw = function() { a += 0.001; var x = ((Math.cos(a)+1) /2) *90; var y = ((M ...

Switch between dropdowns with jQuery

Issue at Hand: In the scenario illustrated below, there is a side navigation bar containing options that reveal a toggled section upon clicking. Specifically, if you select the third item labeled "Dolar" from the menu, a dropdown with three additional cho ...

What is the best way to determine the width of tables - in the HTML code or using a CSS class?

I recently came across some advice suggesting that a website should still be able to function properly even if the CSS files are not loaded. What approach do you think would work best in this situation? Would it be more effective to use <table width=50 ...

Testing jQuery AJAX request with echo on jsFiddle

I'm encountering an issue where the code is displaying 'undefined' instead of appending the response data in HTML format. Can anyone shed some light on what might be causing this? JavaScript: $(function() { $('.document').on ...

React: The peculiar contradiction of useEffect with eventHandler props

Having trouble with this specific example. The issue arises with an Input component that includes an onChange prop to manage internal data changes. Under normal circumstances, if the value is updated externally, the onChange prop does not trigger since t ...

Strategies for Preserving Added Field Data Using JQuery

I am working on a code that dynamically adds fields to a form, you can see it in action on this jsFiddle. My question is, is there a way to keep the newly added fields even after the form is submitted and the user returns to the page? I'm not looking ...

Exploring the Power of jQuery Deferreds and Promises through Multiple getJSON Requests

I'm currently exploring the concept of jquery deferred/promises. I have a decent grasp on how to handle one ajax call, but I'm struggling with managing multiple ajax calls simultaneously. Here is a link to a jsfiddle showcasing my attempt: http:/ ...

By harnessing a JSON response

After sending an ajax request, the server's response is as follows: {"error":false,"success":true} The ajax code used: $.ajax({ url: '/update', type: 'post', data: $(this).serialize(), success: function(response) ...

What is the best way to utilize Ajax and Jquery in order to retrieve data from a PHP database and dynamically update elements with the fetched information?

I am currently enhancing a website to simplify the process for employees when editing products. At present, in order to change prices, someone has to log in to the database and manually alter them, followed by making adjustments to the HTML of the website ...

Verify if the input field is devoid of any content or not

I am planning to create a validation form using Vanilla JavaScript. However, I have encountered an issue. Specifically, I want to validate the 'entername' field first. If the user does not enter any letters in it, I would like to display the mess ...

Integrating XML API Requests Using HTML and JavaScript

When there is only one item in the XML document, I want to update my inner HTML with the result of an API call. I have managed to successfully make the API call work when there are multiple items in the XML document (thanks to W3). <!DOCTYPE html> ...