how to use back button and bookmarking in ajax
i had a similar problem a few months ago.
want to use AJAX but cannot go back after loading.
if you bookmark the dynamically loaded page you don't see the dynamically loaded page again.
there is a solution for this.
hashing is a possible solution for this.
but first lets understand what is hash
hash is a part of the a URL
|scheme||by default it add host name to http|
|host-name||minimum you have to pass that|
|username and password||only used for authentication purpose|
|sub-domain||default is www but added according to server|
|port||default port is 80|
|path||can be null|
|file-name||if null passed server decide|
but for now just get the hash part in your mind
sometimes when you click a link it don't reload but moves you to another part of the page or when you load a page with hash it automatically moves to new location on the page.
you must be thinking how??
the answer is hash
a hash is a part of URL that redirect the user to a part of the page and many browser store a new hash as new link so when you click back you again moves to the location that you left
hashing make pages more navigable and simple to work upon.
so now we will exploit these feature to use back and forward button in Ajax
the answer to this question is setInterval(function,milliseconds) function
we will check that if the hash stored in variable is matching with the hash from the address bar if hash don't match user has clicked back button
in an interval of 500 Milli seconds we will check this and user will see no change
reference to the function used int the code
window.location.hash="hash value here";
note:-remember that when you set a new hash the old hash will become history
add a special character before storing your Ajax information to hash because if a real hash[i mean here that if a "a" refer you to a new page location] come it can distinguish between them like twitter.com user "!" we will here use dollar sign "$"
setInterval is a function that load the specific function pass in after a time-period of the milliseconds passed
note:-1000 Milli-seconds= 1 second
|window.onload=< function name >|| |
load's the function on window load or simply when the page load's
|< string >.split(delimiter)|| |
a delimiter is a character that is used to break a string into array
counting of array starts from 0
var array="this is a string".split(" ");//" " stands for space
|< string >.charAt(position)|| |
return the character which is found on position where position is an integer and can have value 0
same work can be done by < string >[position]here string behaves like array
here is a bad news that internet explorer =<6.0 doesn't support this method.but there is one solution that Gmail.com use but even Gmail.com method don't support mac safari browser
so long for next time
soon i will also give a post for Gmail method.
recommended to that you must read to ensure full knowledge of AJAX
introduction to Ajax with full example
please do post comment [+report bugs (if any)*].