In my page i have a two dropdownlist and 2 partial view. In that partial view i have lot of textbox and that textbox contains values that are entered by the user. So if i redirect this page to next page and use back button to get this page means i lost my partial view and its value.
I use the following techniques.
1) <input type="button" value="Back" class="btn" onclick="javascript:
window.history.back(-1);return false;" />
2) <input type="button" value="Back" class="btn" onclick="window.history.back();" />
3) <input type="button" value="Back" class="btn" onclick="window.history.go(-1);" />
but the fact is i loss my data while pressing the back button.
Please help me to solve this issue..
You have to save this when you go to your next page and disable caching on that page with the data. When you click the back button, your page needs to check if any data needs to be loaded based on some user's session information that represents 'I've saved this already', otherwise they will lose the info. Ideally, you have some session identifier at this point so when the page loads it checks if data from your screen is available - if so load it, if not the form remains empty.
See more details here: Dont break the back button
Related
I have the following three php files:
reports.php, bwdates-reports-details.php and visitor-detail.php
reports.php contains my form which inputs the from and to date (erased some parts for brevity):
<form method="post" action="bwdates-reports-details.php">
...
<input type="date" id="fromdate" name="fromdate">
...
<input type="date" id="todate" name="todate">
<button type="submit" name="submit">Submit</button></p>
</form>
bwdates-reports-details.php outputs whatever parameters inputted in "fromdate" and "todate" of reports.php, see image below
As you can see in the image, there is an option to view the details of a transaction by clicking the "View Details" icon - i class="fa fa-edit fa-1x".
In view details (visitor-detail.php), There is a "Go Back" button.
<div align="center">
<button onclick="goBack()">Go Back</button>
</div>
There is also a goBack javascript function:
<script>
function goBack() {
window.history.back();
}
</script>
But when the go back button is clicked, I am getting Confirm Form Resubmission error. What I wanted to achieve with the "go back" button is to be able to go back to bwdates-reports-details.php with all the variables I passed through in reports.php. How do I achieve what I wanted to do? Please take note that this isn't a purchase related website. php or javascript will do. Thanks!
If a form is submitted (probably with the POST method), you send this data to the new page that is then opened. This page is also added to the history not only with the URL but also the sent data.
If you then leave this page and want to navigate back to this previous page you will get an "Resubmission" error, because the browser would need to send the data again to do so, but that is probaby a bad thing to do, because the data of the form would be sent twice. (Imagine that was a purchase form and the client would buy everything again.)
To make your goBack function work there are no other ways than get rid of that form submission page somehow or put a page in between that is not a form-data-receiver.
The best way would be to not go back in the browser history if you don't know from what pages the user navigated to this. Instead just navigate to an overview or dashboard.
Edit:
If that page your working on is only accessible by that response page of the form, maybe going two pages back will fix your error: history.back(2);
Because your form is using POST method and when you click on goBack button, it goes on previous page without variables. You may use put dates variable with goBack button and also use
if(isset($_GET['your variable name'];
{`fetch your variables`}
on your previous page.
Desired result was achieved by using the GET method instead of POST method (see https://www.tutorialspoint.com/php/php_get_post.htm). reports.php form code was replaced from:
<form method="post" action="bwdates-reports-details.php">
to:
<form method="get" action="bwdates-reports-details.php">
In bwdates-reports-details.php where I have the following variables:
$fdate=$_POST['fromdate'];
$tdate=$_POST['todate'];
Instead I replaced it with:
$fdate=$_GET['fromdate'];
$tdate=$_GET['todate'];
The goback javascript function I have in visitor-detail.php stays the same. And works like a charm. Thanks and cheers!
How to go back without page refreshing.Firstly, I am getting data from AJAX dynamically.but when I click Back button it takes me to the main location where it actually started.
So here's the scenario:
3 Locations
There is a button named Deposit in deposit.php when I press it.It took me to location where there are more buttons,like pay with credit card, pay with debit card etc and when I click on pay with credit card, it takes me to the location pay.php..So far everything's fine...
Here's the problem occurs
whenever I press back, it takes me back to deposit.php instead of pay.php
deposit.php
<input type="submit" class='btn btn-primary btn-large' name="send" id="send" value="Deposit" /><br/>
pay.php
<a id='credit'>Pay with credit card</a>
<a id='debit' href='#'>Pay with credit card</a>
Here one thing to notice:
There are 2 anchor tag.one is without href attribute and one is with href='#'attribute
Talking about without href attribute, when I press the back button it takes me to the deposit.php(completey back, where it all started)
Talking about with href attribute, when I press the pay with credit card button.url changes to /pay.php#.When I first press the back button, it doesn't go back..if I press it twice, it goes to completely back(deposit.php)...
paying.php
should I put back button in here.but can't figure out the scenario of back button
So My question is:
what should I do that whenever I press back button in chrome, it should take me back to pay.php instead of deposit.php
ps: I am using ajax jquery and page is not refreshing anywhere.it
Add this in your input or anchor element:
<button value="Back" type="Button" onclick="history.go(-1);">Go back</button>
Hello I created a simple application that allows me to do a database search. I created an html page with functions in javascript. This is what shows my index.html
<hmtl>
<body onload="initialize()">
<h1>Choose your route:</h1>
<form action="/find" method="POST" autocomplete="on">
<td><input type="text" name="mypos" placeholder="Your Position" size="20" /></td>
<td><input type="text" name="yourpos" placeholder="Destination" size="20" /></td>
<td><button type="submit">Search</button></td>
<button type="Reset" value="Reset">Reset</button>
<div id="map_canvas" style="1500px; 1000px"></div>
</body>
</html>
After inserting the coordinates in the changes and then searching, my output will be a separate line where I can print to the screen if the route exists or not ie: Route not found or Route found.
My problem is to insert a button to go back to this point in the search so as to go back to the start page or index.html. The problem is that I only have one html page (index.html) so any command can only insert it in the search page and not in the results page (the results page is just a printed string is not another html page). This page also interacts with flask. I hope I was clear. Thank you very much for the attention.
As far as I could understand, what you have is index.html doing a postback, and the response of that postback renderizes a different page with the result of the insertion. And it's that result page from where you want to back to index.html. Well, you have two options:
1. In the result page, create a button like this:
<button class="backbutton">Back</button>
<script>
// Somewhere in your initialization code:
const backbutton = document.querySelector('.backbutton');
backbutton.addEventListener('click', function(){
window.history.back();
});
</script>
That gives you some flexibility because it doesn't depend on the route to your index.html page.
2. Simply include a link to your index.html page in your result page:
<a href="index.html">Back to search form</button>
If you want to use the values from a form input after the form is submitted (and cleared), you need to have memorized the value somewhere beforehand. One way to do this is to add (to the input) a listener for the blur event (which happens when the input loses the focus, implying that the user is done editing the input).
In the listener function, you can store the value in a javascript variable for later, like
const firstMyPosInput = document.getElementsByName("myPos")[0];
let myPosValue = firstMyPosInput.value;
Now you can add a new button element (like <button id="myBtn">Try again</button> and give it a click listener that sets the input's value back to what it was before like firstMyPosInput.value = myPosValue.
I load a webpage in a webView. In onPageFinished(..) i run some javascript code, which finally clicks a submit button. So the webView sends Post data and get an answer and loads a new page. That works fine, but i dont need the new page, its just unnecessary network load. I only need to submit the data.
So is it possible to send only the submit without loading the new page? I know that i can send post data with HTTPConnection, but i dont know the header consistence exactly, so i cant set the params. Is there any possibility with JS/Webview to abort?
Edit: I cant override onPageStarted() in my WebViewClient and perform a view.stopLoading(), because the new URL is still the same. But the site appearance is quite different. So i have to stop loading before
HTML of the submit button:
<input type="submit" name="savechanges" class="btn btn-primary" value="Speichern">
and three aditional lines above
<input type="hidden" name="uid" value="390">
<input type="hidden" name="option" value="com_jevents">
<input type="hidden" name="task" value="dash.listprojects">
which meaning i dont know (site is made by Joomla)
You can simply create a "virtual form" and submit it, like:
var $form = $("");
... on click:
$form.submit();
Hope this helps
Ops its removing my html from inside $form, inside the jQuery selector there should be a form like "form method='post' action='{someurl}'" with angle braces opening and closing properly
I have a program that acts sort of like a wizard, so it goes from Page 1, click next, page 2, click next, page 3, etc...on button clicks I am using javascript to put certain checkbox control values into localstorage. My problem is, when I press back to go to a previous page the control values are reset to 0/false. How can I make a pageload type effect in MVC to refill these values from local storage.
One option would be to use DIVs that are hidden:
#using(Html.BeginForm()) {
<div id="step1">
<!--form objects-->
<input type="button" id="to_step2_button" />
</div>
<div id="step2" style="display: none;">
<!--form objects-->
<input type="button" id="to_step1_button" value="Back" />
<input type="button" id="to_step3_button" value="Next" />
</div>
<div id="step3" style="display: none;">
<!--form objects-->
<input type="button" id="to_step2_button" value="Back" />
<input type="submit" id="finish_button" value="Finish" />
</div>
}
And use jquery/javascript hide/show the DIVs depending on the step.
This method has other benefits such as: you can use 1 page, 1 model, 1 form, no reloading needed.
Anecdote: I worked on a property rental website, and the listing form had 87 fields that were grouped, and each group had a tab in a tabbed view (which were just hiding and showing divs within the form). And we added Next and Previous buttons which cycled through the tabs. It worked really well, made sense to the client, and we didn't have to mess around with trying to maintain form field states between pages. Everybody won.
I decided to put JavaScript directly on my View that references my JavaScript file. I put what I called LoadPage() method in the #Javascript section at the top of my page...Inside the LoadPage() I had code that looked like this:
function loadPage(currentPage) {
var currentPage = currentPage;
if (window.localStorage.getItem("chkProvider") == 'true') {
document.getElementById('chkProvider').checked = true;
}
if (window.localStorage.getItem("chkSubscriber") == 'true') {
document.getElementById('chkSubscriber').checked = true;
}
}
This runs when the page loads and sets the values that I need updated. This is an example of how one might update their View using JavaScript and local storage. I hope my solution helps someone!