Having Trouble with the Back Button Functionality

Here is the code snippet I am currently using to create a "Back" button:

<INPUT type="button" value="Button" onclick="window.history.back(); return true;">

The issue I am facing is that on the previous page, there are two div elements. Initially, div1 is displayed when the page loads. Upon clicking a button in div1, it transitions to div2. In div2, there is a "Next" button that redirects to another page. I am looking for a solution to implement a "Back" button that will display div2 when clicked. Using history.back() only shows div1.

Below is the relevant HTML code:

List all your liabilities as calculated on the day the debt was forgiven or prior

NEXT 
<div id="d2">
    <table cellspacing="3">
        <tr>
            <td colspan="2" class="styleh">
                <p>
                    <b>Part II. List the fair market value (FMV) of all your assets, calculated as of the
                        day prior to the debt being forgiven - this would be the "sell today, cash value."</b></p>
            </td>
        </tr>
        <tr>
            <td>
            </td>
            <td>
                <button id="btncalc" onclick="return btncalc_onclick()">
                    Calculate</button>
                <button id="Button2" runat="server">
                    BACK</button>
            </td>
        </tr>
    </table>
</div>

I appreciate any assistance with this matter. Thank you in advance.

c#javascriptasp.net

Answer №1

Give it a shot :

<INPUT type="button" value="Click Here" onClick="history.go(-1);return true;">

OR

Another option is to explore Asp.net Wizard Control for your situation. You can manage NextButtonClick
PreviousButtonClick events using this control.

Answer №2

Modify the code to replace "return true;" with "return false;".

Answer №3

In order to achieve this functionality, it will be necessary to maintain a certain state. One possible solution would be to utilize cookies. You can set a cookie when the second div is clicked and the user navigates to the next page. There are multiple ways to set cookies using JavaScript (See here for an example). Upon returning to the first page, check for the presence of this cookie and display the second div accordingly. Immediately clear the cookie to ensure it does not persist. This method quickly came to mind as a potential approach.

Answer №4

In order to keep track of the previous page's state, you will need to implement some form of storage mechanism.

One common method I am familiar with is using session variables, although this entails coding in the code-behind of the aspx page.

protected void url_onClick (object sender, EventArgs e) {
    Session["state"] = "page2";
    Response.Redirect("url_of_new_page");
}

When loading the page during Page_Load, you will need to handle its state accordingly.

If you prefer a purely JavaScript solution, utilizing cookies would be necessary. For more information on how to use cookies in JavaScript, refer to this resource.

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

What methods can be used to develop a data input code that avoids endless repetition?

For some reason, the name and score stored in varchar format in MySQL are arranged in descending order by score using a linked list. However, this leads to an endless loop when attempting to save the information. `public class PlayerController : MonoBehavi ...

c#mysqljsonunity-game-engine

Locating items within a complex array and identifying their corresponding positions

I recently found an interesting code snippet from a different question that allowed me to identify an object. However, I am now faced with the challenge of determining the position of that object within the array. Let's take a look at the example belo ...

javascript

I am in the process of creating a dropdown menu for a navbar that will appear when the cursor hovers over a specific element, complete with an arrow pointing upwards

In my current project with NextJS and Tailwind CSS, I've successfully created a dropdown menu but I'm facing an issue with positioning the arrow to point to the specific element being hovered on. In a previous version, I tried rotating a div at 4 ...

javascriptdrop-down-menunext.jshovertailwind-css

Issue with ReactJS on the server side rendering

Could someone please help me understand my current issue? On the server side (using Node.js), I have the following code: var React = require('react'); var ReactDOMServer = require('react-dom/server'); var TestComponent = React.create ...

javascriptnode.jsreactjs

Transforming the AngularJS $http GET method to OPTION and including custom headers

var users= $resource('http://myapp.herokuapp.com/users', {}); users.get(); The change in the HTTP GET method to OPTION occurred after implementing a header method. var users= $resource('http://myapp.herokuapp.com/users', {}, { get ...

javascriptangularjscross-domain

Managing a high volume of HTTP requests within a React-Redux application

Seeking assistance with my react-redux app project. I have a substantial amount of data that has been divided into smaller files, allowing the user to choose a start and end time range. Upon clicking the "Fetch data" button, I create HTTP request promise ...

javascriptreactjsredux

Tips for extracting information from a website with Selenium using Python

I am currently working on a project that requires me to extract certain information using Selenium from a webpage. The elements I need are not directly visible in the page's code, indicating they may be generated by JavaScript. Here is a snippet of my ...

javascriptpythonseleniumparsingselenium-webdriver

The variable in my scope is not reflecting the changes in the HTML view

Here is my code for handling file attachments in AngularJS: $scope.attachments = []; $scope.uploadFile = function(files){ for(var i=0; i<files.length; i++){ $scope.attachments.push(files[i]); console.log($scope.attachments.length); } } ...

javascripthtmlangularjsangularjs-scope

What causes the mounted hook in Vue to be triggered multiple times when used within a plugin or mixin?

How can I prevent repetitive behavior in my code? Is this a bug that needs fixing? Take a look at the plugin below: const globala = { install(Vue) { Vue.mixin({ mounted() { console.log('hi') } }) } } And here&apos ...

javascriptvue.jsvuejs2vue-componentvue-mixin

Is there a way to confirm if an element's predecessor includes a specific type?

I am working on an app where I need to determine if the element I click on, or its parent, grandparent, etc., is of a specific type (e.g. button). This is important because I want to trigger a side effect only if the clicked element does not have the desir ...

javascripthtmlreactjstypescript

"Using the Google Maps directive inside a separate modal directive in Angular results in a blank map display

As a newcomer to Angular, I have encountered a hurdle while attempting to incorporate a 'google maps' directive inside another directive. The following code showcases a 'modal-view' directive that loads a form: angular.module(&apo ...

javascriptangularjsgoogle-maps

ajax - unable to fetch information from the same domain

UPDATE: The solution provided by Cavid Kərimov indeed works. By setting the form as shown below, it also resolves the issue. <form onsubmit="return false;"></form> I am attempting to fetch a simple text string from a PHP file using jQuery an ...

javascriptphpjqueryajax

Error message: "jQuery is not defined and occurs exclusively in Chrome."

I've been using the following code to asynchronously load my JavaScript in the head section: <script type='text/javascript'> // Add a script element as a child of the body function downloadJSAtOnload() { var element4= document.creat ...

javascriptjquerygoogle-chromeasynchronous

Ways to quickly search through SQL table columns for keywords

Seeking ways to quickly search through columns in SQL tables for specific keywords. There are 3 tables involved in this example: Table 1 contains Makes: MakeID MakeName Table 2 contains Models: ModelID MakeID ModelName Table 3 contains Cars and their ...

asp.netsqlc#-4.0entity-framework-4

Stripping HTML elements from the body of an HTML document using AJAX before transmitting it as data to the controller

My JSP page contains two buttons labeled "download" and "sendemail". When the "Sendmail" button is clicked, an ajax method is triggered to generate a PDF version of the HTML body and send it to the back-end controller. I attempted to utilize the following ...

javascriptajaxjsppdfdocument-body

Error: A reference to an undefined alertbox with a value extracted from a list was not caught

When I click on a button, I want to display the first value in a list using an alert. I found some inspiration from this discussion. Although the original solution used a table instead of a list, I attempted to adapt it to my needs. However, it seems like ...

javascriptjqueryhtml

whole number doesn't change

Hey there! I'm struggling with the code below: public partial class _Default : System.Web.UI.Page { int myValue; protected void Button2_Click(object sender, EventArgs e) { myValue = myValue + 1; Label2.Text = myValue.ToS ...

c#asp.netbutton

Is there a way to overlay a div on a particular line within a p element?

Within this paragraph lies a collection of text encapsulated by a < p > tag. When this content is displayed on the page, it spans across 5 lines. My objective is to creatively style and position a < div > tag in order to highlight a specific li ...

javascriptjqueryhtmlcss

Exciting discovery within my coding for US Number formatting!

I am currently working on formatting 10 digits to resemble a US telephone number format, such as (###) ###-####. Although my code successfully achieves this goal, it also has an unexpected issue that I'm struggling to identify. Specifically, when ente ...

javascriptjqueryregex

What are the essential Bootstrap CSS and JavaScript files that need to be connected to our HTML document?

I recently downloaded the most recent version of Bootstrap, which is version 4. Upon extraction, I noticed that it includes two folders: one for CSS and the other for JS. The CSS folder consists of approximately 12 CSS files, while the JS folder contains ...

javascriptcssbootstrap-4bootstrap-modal