Solved

Javascript and Focus

Posted on 2006-07-11
11
278 Views
Last Modified: 2012-06-27
Hi,

I have a question regarding how to set the focus to a specific "spot" on a new page.  

I will go to AAA page first.  AAA page is usually long with vertical scroll bar.  It has a list (bullet points) of texts.  I can make the texts <div> with anchors.   Users can use scroll bar or page Up/Down to go to any spot on AAA page.  Then users have a button on AAA page to go to BBB page.  This BBB page has the same list (bullet points) of texts, but in another language.  This means the lengh of the texts (bullet points) might be very different on the two pages.

We wish to put the focus roughly at the same bullet point on BBB page when user leaves AAA page.  Since users do not really have a focused control when they move from AAA to BBB, it seems we cannot track where they really are (at AAA page).  Or can we?  

Is there a way to do this?  Thanks for any help.

TSG
0
Comment
Question by:SRO_TSG
  • 2
  • 2
  • 2
  • +2
11 Comments
 

Expert Comment

by:ObiRenoKenobi
Comment Utility
I'm not sure of your question. Do you mean that when a client switches from page A to page B (in your site the both of course) in the B page he must be taken automatically to the same spot that he was in page A?
0
 
LVL 4

Expert Comment

by:programmer1024
Comment Utility
You can use the # sign within html element/form tags to send the focus.
0
 
LVL 4

Accepted Solution

by:
programmer1024 earned 43 total points
Comment Utility
Alternatively you can probably give that element/form a name and use the onFocus() event.
0
 
LVL 5

Expert Comment

by:muktajindal
Comment Utility
Before redirecting the user from page AAA to BBB, you will need to keep track of the last element being focussed by the user on AAA (by using the onFocus() event of every focussable element), pass it alongwith request, and then map it to the corresponding item on BBB and set focus on it. You can achieve it by keeping same element names on all the pages or by providing some kind of mapping.
0
What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

 

Author Comment

by:SRO_TSG
Comment Utility
Thanks a lot for all the suggestions!!

I think the problem I have is that users might not have a "focusd" element.

On Page AAA, I have a list of bullet points (all texts).  I will give each one an anchor tag such as A, B, C.  Then users can use scroll bar or Page Up/Page Down to scorll on the page.  Users do not need to user Tab or Mouse to "focus" on any thing on the page.  Then users will clik a button which is actually on a seprate frame to make Page AAA go to Page BBB.   When users use scroll bar or Page Up/Page Down to read the html page,  is there actually a focused element?   I might be able to track the distance users scroll down from top, but since Page BBB is in another language, the lenght of the texts might be very different.  Forcing the focus to scroll down certain distance might not have focus "arrive" at similar spot.

Thanks!!

0
 
LVL 5

Assisted Solution

by:muktajindal
muktajindal earned 41 total points
Comment Utility
There are two issues that are bothering me about your implementation:

1. How will you measure the length of the page being traversed by the scrollbar??

2. Even if you are able to calculate length anyhow, there is further issue. Different users may have different text size settings on their browser. How will you take care of that while mapping page length to the last element being viewed by the user?

I'm sorry but I don't think it's easy (or I must say possible) to implement what you are talking about.
0
 
LVL 6

Assisted Solution

by:Basilisci
Basilisci earned 41 total points
Comment Utility
This is a bit hard to implement, but I have done a similar system for a intranet webapp. It works, and does not rely on any focussed elements.

Use a common js library on each page, containing the following logic.

- Attach an onscroll event handler to the window object. On each scroll event, store window.scrollTop somewhere (more on that later)
- Attach onload event handler, which checks if a stored scrollposition value for the page is found, and scrolls the window to that position (scrollTo()).

Propably you'll want to store scrollpositions to an "array" indexed by each page's url (var scrollPositions = new Object(); positions[url] = position; ).

The biggest problem is where to store the array so that the variable does not disappear with each page. If you are using frames, you can store it in some frame, or just attach it to top.scrollPositions. Other option would be to keep the position storage in a cookie that is created and updated via javascript, but that would be a bit inefficient, considering that onScroll events get executed very often, so it should be kept lightweight.
0
 

Author Comment

by:SRO_TSG
Comment Utility
Hi,

Thanks for the great hints.  I think Basilisci's solution is of great help for this approach (find the position of the scroll).  However, since Page BBB might be in a different language, the position might be very different.   The comment from muktajindal is our concern too.

Page AAA will have a list of bullet points (say i, ii, iii, iv, v, vi, etc).  Users scoll to view these points.  Each point has very different length.  If users scroll down to see roughly point iii, then they press Page BBB, we wish Page BBB go to point iii.  We actually have a few different languages, including Asian languages.  So using the scroll posiiton might not make the page arrive at that "point" users are reading at Page AAA...

But this hint is very very helpful for future reference.  Thanks a lot!!

TSG

0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

I know it’s not a new topic to discuss and it has lots of online contents already available over the net. But Then I thought it would be useful to this site’s visitors and can have online repository on vim most commonly used commands. This post h…
Here we come across an interesting topic of coding guidelines while designing automation test scripts. The scope of this article will not be limited to QTP but to an overall extent of using VB Scripting for automation projects. Introduction Now…
In this fourth video of the Xpdf series, we discuss and demonstrate the PDFinfo utility, which retrieves the contents of a PDF's Info Dictionary, as well as some other information, including the page count. We show how to isolate the page count in a…
In this seventh video of the Xpdf series, we discuss and demonstrate the PDFfonts utility, which lists all the fonts used in a PDF file. It does this via a command line interface, making it suitable for use in programs, scripts, batch files — any pl…

762 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

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now