The data is displayed in gridview with paging on an AJAX enabled webpage. The gridView contains Item templates containing a link button. On itemCommand event, page redirects to display data in new page. When the Back button on browser is pressed, the previous state of the page doesn't load.
Perhaps set a cookie and use it to get the right page when initializing the gridview. Or modify the hash at the end of the URL (eg, add "#page2" to the location bar and read it back on init).
Look at this js stuff from google
Use Google Web Toolkit, it allows the state to be bookmarked and isn't affected by back/forward button.
Otherwise your options are:
Telling the user to not press the back button.
Putting the state in the url, e.g mypage.asp#page_123 and using that to determine the state in your javascript at page load.
Related
I have some buttons on a page and on click of each button the page gets reload and the data changes. Now, I would like to refresh that particular fusion block only without reloading the page. The buttons are added to the page as a widget (with some valid reasons) and the fusion block is on the page itself. Would it be possible to achieve what I am looking for?
I'm adding a facebook share button to each post on a Wordpress (Using Facebook Share Button New plugin), it works ok for each post/page except when i'm loading them trough ajax, the result it's a normal Facebook like button but the popup (to write a comment) appears inside the button it is not expanded.
To check go to: http://iwanttobeher.com/ and then click on any face at the bottom of the page, then test the like button and you'll see what happens.
I don't know what to do, i tried to FB.XFBML.parse() after loading the content but the result is the same.
Switching to HTML5 didn't help in our case. What did was to remove the FB object just prior to new content being inserted into the page via Ajax:
delete FB;
wrapper.html(response.data);
We reload full pages via Ajax and so new page content recreates the FB object and re-initializes XFBML anyway. Not sure if this workaround would work if we reloaded only parts of the page though.
The original answer is here.
I've managed to fix it by changing the implementation to HTML5 instead Iframe or XFBML using Facebook's tool to generate like buttons: https://developers.facebook.com/docs/reference/plugins/like/
If you carefully notice facebook, you will understand that the when you visit one page to another then the whole page is not refreshed or redirected but the URL changes when navigating to new page. It is more clear when chat windows are open, they remains static during page loading. As other website does this by using the # but facebook does not.
There is another example came to me: http://www.davidwalsh.name/. Visit the site and open other pages within their site and you will understand what I mean. Don't forget to notice the URL change.
How they do this?
Added More: I want a way that the page content will be loaded with ajax, change the URL for bookmark feature but when changing URL it should not reload / refresh the page by not using # (hash).
You have two questions:
For the URL change you can put the path instead of the # in the href property of the anchor (e.g /otherlink).
For opening the chat or opening some div does not require to send it in the url, its the onclick event on the div and its expands. Also the chat remains open may be thay set cookie or flag when the chat is first time opened and checking and changing the chat with flag they are setting.
As suggested by #andytuba
For Facebook, Google "hash navigation ajax".
For DavidWalsh, google "history API".
I am just wondering how facebook manage requests to "my profile page" and "home page" and some other pages that seem to reload just some content.
For example when I am on "my profile page" on facebook, i Hit the home button and the top bar button and chat panel on right side remain intact (they are not reloaded). I have monitored XMLHTTPRequest in webkit console and no ajax is generated, so its not Ajax (i think). Otherwise, if FULL http requests are generated when clicking those links, I thought the full page must be reloaded, I am right? So I have no clue how is this handled. Can you give me a hand please?
Thanks :)
It's a type of performance optimization called "quickling", they also use a "pagecache" strategy to reduce the data from server. In the lower level, it depends on javascript perform as a LinkController, which delegate a hyper-link click event and then send an ajax (or use iframe) to request the pagelet data from server, the response will be a json-formed data structure, then javascript will insert the content of current page. Uri in your address bar can be dealled with the hash change event in old browsers and H5's History API (pushState) to manage the history record of browser.
I am trying to open a control panel in FANCYBOX.
I have a form in my page which its action and field names are same as another website and once user submit it they will redirect to their control panel in that website in a new window.
What I want is to open it in fancybox. I do not want to user leave my page, I just want them to access to that panel inside my website.
And also I want to all links of the opened frame target be _parent. I mean if they go to different parts of their panel it shows in the same fancybox not open a new window.
You might wanna look at iframe i.e. Add class='iframe' to a link check it on this page.