Browser Back Button Ajax - php

I know there a bunch of topics on this, but I couldn't determine what to do based on what I read in the other topics.
I have a page "abc.php". The user can do a search which then populates a form with 2 ajax requests. Then if the user navigates to another page and then clicks BACK to "abc.php", the contents of the form is not complete because the ajax doesn't run. Is there a way to make this happen?

Modify your URL when you do the ajax by adding the search terms there after a hash (e.g. http://example.com/search.php#search-terms-here)
Then when the page is loaded, read the search terms back from the URL.

This is a very nice article / tutorial on enabling the back-button using jQuery.

Using history.js, the following function 'listens' to changes in the url bar, and calls a function to load the appropriate page:
History.Adapter.bind(window,'statechange',function(){
var State = History.getState();
page(State.url);
});
function page(url) {
//AJAX
}
Now whenever you want to change the page, you call:
History.pushState({state:X}, "Page Title", "Page Url");
This will update the browser's url bar, and automatically call page(State.url) for the new url; and all the browser features like forward/back button, bookmarks, etc... should work.

Related

Adding Back button for web page loaded within another web page

I have an index.php with two major sections: the navbar and the main-content. The navbar contains links which will load another webpage to the main-content through this jQuery code:
jQuery('#main-content').load('sampleurl');
Some of these web pages contain links to another web page, so I want to add a back button.
I tried using the history.back() and history.go(-1), as well as the $_SERVER['HTTP_REFERER'], but they don't really work in my case.
How will I add the back button in this situation?
You should keep your last viewed page in JavaScript variable or in value of hidden input and then you only need to add button with
jQuery('#main-content').load(old_url);
You must always update your variable when you load your next page via jQuery('#main-content').load('sampleurl');
Try manipulating the javascript location or location.hash
https://developer.mozilla.org/en-US/docs/DOM/window.location
Of course, you need to be able to turn your URL back into the relevant page content too.
In conjunction with both Charlie and Michael's answers, since you are already using jQuery, another option is to include the jQuery Address plugin.
You can implement this idea, by creating a function to read a hash path to load new content. Following this, the content can be navigated by the built-in back + forward buttons.
The only challenge I foresee with this implementation is associating the new content with the hash path.
Good luck!
Just an idea: Add hash to Url whenever you load the page; and then you can use history.back()
$(function(){
if(window.location.hash === 'sampleurl'){
jQuery('#main-content').load('sampleurl', function(){
window.location.hash = 'sampleurl'; //<<-- match with your loaded page;
});
}
});
good luck !

PHP/Javascript Bypass user input to display div

I have a page where if you click on a link, it exposes a div that using ajax displays content from a dbase.
After a user edits this content on the server, I'd like to use PHP to return the user to that page. This is no problem using a redirect
header("location:page.php")
However, when the user comes back to the page, ideally, I'd like to have the content in the div open automatically so the user can immediately see edits without having to find the link to open the div and click on it.
Is this possible, either with something in the url to fire the javascript or alternaively, when you load the page with a certain parameter, triggering javascript to open the div.
The code to open the div is a simple javascript call:
View Content
showDiv just uses ajax to display something from the server using responsetext.
Thanks for any suggestions
header("location:page.php?show=1")
Then in page.php body tag:
<body <?php if($_GET['show']==1) { ?>onload="showDiv()"<?php } ?>>

Altering the back behaviour in the browser PHP

In my PHP site, when a user adds something to their cart I trigger a URL change to make some functions and triggers on the page:
Original URL
/category/product/10
New URL
/category/product/10#addtocartbutton
URL becomes
/category/product/10?x=1
The method:
/category/product/10
/category/product/10#addtocartbutton (user clicks an onclick href to submit form)
/category/product/10?x=1 (the form adds the item to the session and appends this URL querystring)
The problem is when they press the bac b
In Javascript, using location.replace instead of location.href = 'new location'
Take a look at: http://www.roseindia.net/javascript/javascript-location-replace.shtml
-> location.replace will replace the current address by the new one -> when user click back button -> error will not happen.
Or try something with pushState. You should be able to manipulate you're history according to your needs.
A good idea is to make the add function redirect you back to the product page without showing the query-string. Since I dont know how you wrote your add controller it's hard to give you an exact code example...
Write the PHP controller for adding something like:
function add_to_cart()
{
add $_GET['x'] to session;
redirect back to product page;
}

how can i redirect a user to custom url after adding page through add.php (Facebook)

How can I redirect a user to just added page after adding it through add.php?
let's say my url looks like: http://www.facebook.com/add.php?api_key=API_KEY&pages=1
After selecting a page from the select box and clicking 'Add MY_APP_NAME' user is redirected to the wall of the page instead of to freshly added MY_APP.
Notice
I know this type of questions lots of here but i have no found any solution that why i put this question here again.... helps are definitely appreciated
Tried
I tried myself like this using Javascript but seriously not success
<script>
if (window == top) {
top.location.href = 'https://apps.facebook.com/abc/' + document.location.href.replace(/https?:\/\/[^/]*\/?/, '');
}
function addToPage(page_id){
top.location.href = 'http://facebook.com/add.php?api_key=<?php echo C_APP_ID; ?>&pages&perms=publish_stream&page='+page_id;
}
</script>
See Image
https://www.facebook.com/dialog/pagetab?
app_id=APP_ID&
display=popup&
next=https://facebook.com
Using this alternative method you can specify the URL to be redirected to after interacting with the dialog to add an application to your page in the next parameter.
You could try adding that parameter to your request.
Other possible alternatives for the next parameter are -
redirect_url
redirect_uri
Both are used elsewhere when dealing with redirecting users - perhaps one of them will assist you as well...

javascript/php - record click destination before redirect

Say I have the link:
google
Is there any way I can record the click (with php/sql)? For example an onclick event to load ajax? Would the ajax run before the page redirects? I want to avoid:
google
You could change your link to:
TEST
And then use the function:
function recordClick(t) {
//Insert AJAX here. t contains the URL
document.location = t;
}
You could then wait for the AJAX request to complete before using the document.location part. However I would suggest simply using a separate file to log clicks like you have already suggested because it is an immediate action that doesn't require JS to be on, and that provides immediate feedback.

Categories