Solved

What causes page repositioning or not?

Posted on 2007-03-21
15
362 Views
Last Modified: 2008-01-09
Question: When I post back a page to the server and reload the same page, what causes the browser to reposition the page (vertical scrolling wise) to the same position it was in before the postback?

Example: http://www.thepropertyinvestmentshop.co.uk/About/FAQs/tabid/58/Default.aspx

Now this takes careful testing  but if you shrink your browser window height to, lets say half the page height, then scroll to the very bottom of the page, then click on the bottom question, and for me it reloads the page with the answer now displayed AND repositions the page at the bottom, where I had it before.

Can anyone explain why this happens? Because on another site I have it doesn't do the reposition and I want it to! The only difference that I can think of is that this site uses tables and the other site doesn't. But I can't imagine how that might make a difference.

Any thoughts much appreciated.
0
Comment
Question by:Dale Burrell
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 3
  • 3
  • +1
15 Comments
 
LVL 11

Expert Comment

by:JamesCssl
ID: 18768550
for "204 No Content", HTTP/1.1 specifies that "the user agent SHOULD NOT change its document view" which pretty much means that it should keep its place

from: http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html#sec10.2.5

[quote]
The server has fulfilled the request but does not need to return an entity-body, and might want to return updated metainformation. The response MAY include new or updated metainformation in the form of entity-headers, which if present SHOULD be associated with the requested variant.

If the client is a user agent, it SHOULD NOT change its document view from that which caused the request to be sent. This response is primarily intended to allow input for actions to take place without causing a change to the user agent's active document view, although any new or updated metainformation SHOULD be applied to the document currently in the user agent's active view.

The 204 response MUST NOT include a message-body, and thus is always terminated by the first empty line after the header fields.
[/quote]
0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 18768601
But in the case of a form post there is definitely content returned? The entire page is returned?
0
 
LVL 11

Expert Comment

by:JamesCssl
ID: 18769111
You appear to be correct.  I'm not sure why it is doing what it is doing.
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 17

Expert Comment

by:NicksonKoh
ID: 18769458
Hi,

The trick done on that page is with javascript. However, this is still not the best way to do it as there is still jumping that will cause a user to loose where he last read.

The better way is to be able to submit a form, get the request and insert the result below all without any page refreshes. How you do this is to use AJAX/hidden iframes to submit the request and get back the result. And then using some javascript you can insert a row just below current text with the return result.

Please take note it important to use  "return false" when doing a form submit as this will cause the page not to jump to the top of the page when the form is submitted.

If you need some sample codes, I am sorry to tell you that I do not some sample codes to show you.

cheers
Nickson
0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 18769817
Hey Nickson - well done for spotting that... can you point me to where the JavaSCript is located and how it is called (onload somewhere?).

Cheers,
0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 18872073
Hi Nickson - can you please point me to the JS that is causing the reposition on the example page please as I haven't been able to find it.

Cheers,
0
 
LVL 17

Expert Comment

by:NicksonKoh
ID: 18874200
The javascript on the page is too complicated for me to understand. Here's the little I understand

You can get all the html, js and css by doing File > Save As from the page.

If you look at the HTML. You will see the each link is has an id and the href actually calls the js function "__doPostBack('AnchorLinkName', '')".

E.g.

<a class=SubHead
                              id=dnn_ctr378_FAQs_lstFAQs__ctl4_Q
                              href="javascript:__doPostBack('dnn$ctr378$FAQs$lstFAQs$_ctl4$Q','')"><span
                              style="BORDER-TOP-WIDTH: 1pt; PADDING-RIGHT: 0cm; PADDING-LEFT: 0cm; BORDER-LEFT-WIDTH: 1pt; FONT-SIZE: 8.5pt; BORDER-LEFT-COLOR: windowtext; BORDER-BOTTOM-WIDTH: 1pt; BORDER-BOTTOM-COLOR: windowtext; PADDING-BOTTOM: 0cm; BORDER-TOP-COLOR: windowtext; PADDING-TOP: 0cm; FONT-FAMILY: Tahoma; BORDER-RIGHT-WIDTH: 1pt; BORDER-RIGHT-COLOR: windowtext; mso-fareast-font-family: 'Times New Roman'; mso-ansi-language: EN-GB; mso-fareast-language: EN-GB; mso-bidi-language: AR-SA; mso-border-alt: none windowtext 0cm"><strong>Where
                              is the best place to buy?</strong></span><span
                              style="FONT-SIZE: 12pt; FONT-FAMILY: Tahoma; mso-fareast-font-family: 'Times New Roman'; mso-ansi-language: EN-GB; mso-fareast-language: EN-GB; mso-bidi-language: AR-SA">
                              </span></a>

Now this part, I believe is just to get the FAQ answer and insert it below the page and doesn't do the repositioning.

The repositioning seems to be done in the below function in dnncore.js

function __dnn_Page_OnLoad()
{
      if (__dnn_ClientAPIEnabled())
      {
            var sLoadHandlers = dnn.getVar('__dnn_pageload');
            if (sLoadHandlers != null)
                  eval(sLoadHandlers);
            
            dnn.dom.attachEvent(window, 'onscroll', __dnn_bodyscroll);
      }
      __dnn_m_bPageLoaded = true;
}

That's as much as I can understand.

cheers
Nickson
0
 
LVL 17

Accepted Solution

by:
NicksonKoh earned 250 total points
ID: 18874211
Here's the function that is called by __dnn_Page_OnLoad() for the repositioning.

function __dnn_bodyscroll()
{
      var oF=document.forms[0];      
      if (__dnn_ClientAPIEnabled() && __dnn_m_bPageLoaded)
            oF.ScrollTop.value=document.documentElement.scrollTop ? document.documentElement.scrollTop : dnn.dom.getByTagName("body")[0].scrollTop;
}
0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 18874287
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19347823
Change
href="javascript:__doPostBack('dnn$ctr378$FAQs$lstFAQs$_ctl4$Q','')"

to

href="#"
onClick="__doPostBack('dnn$ctr378$FAQs$lstFAQs$_ctl4$Q',''); return false"

Michel
0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 19349126
I don't have any access to the JavaScript as this is all within DotNetNuke - its just weird that using the same software works on one site and not another. I was wondering if it was something to do with the HTML/CSS of the template?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19383161
The href you use reloads the page. If you cannot change it, I suggest you contact the makers
0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 19384671
I really don't think that is the problem because as I indicated it works perfectly on the site above but not on another site I am developing - both using the same software,
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19387434
I see.

I cannot tell you. Too many things going on

the problem lies in the page you see when you click and not the page you see when you load the site.
0

Featured Post

SuperAntiSpyware Licenses Discounted by 25% !

Exclusive offer to Experts Exchange Members!
Buy SuperAntiSpyware License(s) from us and save 25% on the regular purchase price.
- Includes Full SuperAntiSpyware Vendor Support Entitlements
- Your Subscription does not begin until you activate your license
- Buy for your friends

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Increase image taller on inner pages 2 53
aria difference 2 22
adding straight up HTML to drupal 7 2 9
Today Date 3 13
Today, still in the boom of Apple, PC's and products, nearly 50% of the computer users use Windows as graphical operating systems. If you are among those users who love windows, but are grappling to keep the system's hard drive optimized, then you s…
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.

710 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question