I have a standard PHP form that has a series of checkboxes, radio, selects and text. The form works fine and proceeds to a search results page. My problem is that when you click Back browser in any browser the search page shows the previous selects. How do I ensure that the back button displays the form as if its the first time the visitor visits the page?
You can reset form on window.onload or $(document).ready(for jQuery)
function formReset()
{
document.getElementById("formId").reset();
}
you can do one thing.
Using jquery onReady function you can make form reset.
So, whenever user will press back button of browser page will be reload and onReady function your code for form reset will work.
$(document).ready(function() {
$('#myform').get(0).reset();
});
You shouldn't reset it automatically. Provide a reset button.
The back button returns the user to the previous page, in the state he left it. This includes the settings of any form. I'm relying heavily on this feature, cannot count the times this back button saved me from loosing my efforts that went into a textbox for answering questions...
It's a different game if the user is on your result page and clicks a link that takes him to the search page again, but does not use the back button.
Related
I have a web page that loads all the data from a mysql database called datalist.php
From this page I can edit record by record with a button that redirects you to an editdata.php page adapted to the fid of the record.
Once edited as they want to see the changes, I don't redirect them to the main one letting them see the changes and simply clicking back or with a button they return to the datalist.php without any problem.
The button is this
echo "<p id='parrafo'><a style='padding:1px 20px'class='button rounded-0 primary-bg text-white w-0 btn_1 boxed-btn' href='javascript:history.back() '><--</a></p>";
PROBLEM
I added a search engine where the displayed data can be filtered.
When they use the search engine from datalist.php, I direct them to a page called search engine.php where, through a post method, I store what they are looking for in a variable and the data that users want appears.
But when they edit a filtered record, it is edited without problems, but when they go back, they return to the search engine.php and the message appears:
"Confirm form resubmission In order to display correctly, this web page needs the data you entered earlier. You can submit that data again, but that will cause the page to repeat all previous actions. Press Reload to submit the data and display the page.
Hit the page refresh button to resubmit the data needed to load the page."
Of course, if they update, they come back when the filtered data comes out.
Isn't there any way to store the variable used in the search so that when I go back I don't get this error or any solution??
simple! when user will submit form for that variable instead of making post request
option1: just use get request __url__?variable=... but this will not remember the variable when you go back
option2: store the variable in the cookie and just go to next page (eg. window.location.href = '...';). and in next page access the cookie from php.
If you are wanting to show the form to the user as a confirmation, but without the possibility of another post, then remove the form element and the button. Display all other boxes as they are (with the values populated from the POST array).
And display another message telling them that it has been successful.
You are using PHP, you can achieve this easily with it. If you are unsure, then post a short version of your code in a separate question.
I have a form with multiple tabs. Each tab has various items (textboxes, radio buttons, drop down boxes). I need the content to be saved after 15 seconds idle or when the user clicks on a different tab/item.
Currently I am saving when the user clicks on a button. This is giving the problem that if the user is on tab x and clicks the button, the form is taken back to the first tab.
I would prefer to have the save button on the last tab. When the user is filling in the data in the different tabs, it is automatically being saved. When the user clicks on the last tab, the command button is shown and then upon clicking another save is performed and the user is taken to the main screen with all the records.
Your advice and guidance please :)
Regards,
Babu
I'd say you want to submit each tabs content (form values) using an ajax call in background when another tab is selected. That way you can have the user navigate between tabs without having to reload the whole form. And the values are handed over to some ajax endpoint on your server where they can be stored.
You can do the same for an autosave feature: set a timer, when that triggers you use an ajax call to post the form values in background.
To make your life easy use jquery for the ajax calls and jquery-ui for the tabs.
You dont save the previous tab datas until you save the datas in last tab.. because if user is not willing to save the data after moving to last tab mean.. it is waste of saving previous data and deleting it..
So you can do it in SESSION... (i.e) you store the datas of each tab in session with one session ID as
$session[ID][fieldName1]
$session[ID][fieldName2]
$session[ID][fieldName3]
finally if the user click on that last button tab.. you get the datas from session and save in database USING AJAX and unset the session variables.... unset it if he clicks cancel also.....
You can also use Jquery tabs so that the complete form is on one page and the form can be saved on the last tab (with your button).
This way you don't have to worry about your data being saved until the last tab.
I'm developing an application in mobile view using CakePHP, where there's no Javascript code can run.
My scenario:
In user login form, users clicked submit button. But before the data submitted and users go to the next page, I make an 'interruption' page (renders a new view). In there, contains "Facebook" and "No, thanks" button. When they click "Facebook", they will connect their Facebook accounts. But, if they click "No, thanks", the login continue.
My question is, how can I make that "No, thanks" button? Because if I use <input type="submit"> button, the form that contain its data is in previous page, so this button will not be clicked. And, how to store POST data, and when that "No thanks" button clicked, then, the data submitted?
You can either store the data in session, or you can make the "no thanks" button the submit button of a form where all the data from the previous page is stored in hidden form fields.
Personally for a number of reasons, I would prefer to utilize sessions, but since you are even asking this question, I am guessing you are unfamiliar with usage of session data.
A simpler question would be:
To make these two forms on single page but with LOTS of vertical or horizontal space in between user login form & 'interruption' page so user seeing the login form can't see interruption section although both are within same <form></form> tag. Then, the the submit button is simply a link to interruption section of the same form. this link is simple an <a> tag with inline linking, which would hide the login form & display interruption page without needing javascript. similar to links to Go to Test Section A on this page
http://www.dynamicdrive.com/dynamicindex5/bookmarkscroll.htm
Further then in the interruption section you can use a real submit button which makes a POST back to request the server.
[edit]
This workaround is based on assumption that user doesn't scroll far enough. Because most users won't, making it 1step process for them instead of 2process which is specially important on mobile. And if somebody does then the empty form gets submitted to the server & then we can run validation & return a error to the user. where he/she can fill the complete form. so This is a good workaround better than storing the data in session & making two POST request for every user login over mobile network which are generally unreliable.
A better solution might be just to combine both forms into one form. Then you don't have to make 2 http requests. Maybe all you need to do is to add one extra button to the original form "Login with FaceBook" next to the other submit button.
I am trying to build a web app like this using php, it has two pages:
select.php has some radio buttons in a html form for users to choose. and there is a submit button post the form to a confirmation page.
confirm.php echos the summery from previous page and there is a "back" button allow users to change their selections in the previous page.
In this point, when I hit the "back" button and previous page restored, I would like all my previous selections displayed. (more clearly, if I chose a radio button and submit in select.php, I want the radio button still being chose after I go back to select page by hitting "back" button from confirm.php page.)
Please give me some idea about how to do this kind of restore page thing.
Save your selection in session.
In select.php pre-select the radio buttons if its found in session.
BTW, You should not rely on back button of browser. Create you own back button on confirm.php page. This back button will go to select.php using no history.back()
The HTTP-Protocol is stateless.
So when calling select.php the server doesn't know anything about your previous selection.
You can either save the selection in the session or in a cookie and restore in in selection.php
I have a form with a save button, but i want users to be able to come back to the form at anytime to finish filling it in. I would like to know if its possible to bypass the save button, so the user fills part of the form in, as soon as they navigate away from the page or close their browser it will save the form automatically to resume next time.
What would be the best way to implement this? Thanks in advance for any help, its much appreciated.
I have seen some javascript examples but have seen issues with cross browser support.
You can use an AJAX Call on unload like this:
window.onunload = myfunc();
function myfunc() {
alert("i am closing now");
// Your AJAX Call that saves your data (e.g. all input fields)
}
Jquery plugin, works a treat for autosave function.
http://plugins.jquery.com/project/jquery-autosave
More info here:
http://rikrikrik.com/jquery/autosave/#examples
include plugin:
<script type="text/javascript" src="scripts/jquery.autosave.js"></script>
$('form.formnamehere').autosave({
'interval': 20000
});
Auto submits form without page refresh.
I have set my interval to one second (1000) so the form gets saved every second. Therefor if the user exits the form after editing then it has autosaved.