View Single Post
  #1 (permalink)  
Old December 18th, 2007, 06:29 PM
sudhirgk sudhirgk is offline
Registered User
 
Join Date: Dec 2007
Location: , , .
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Default HTML anchor and JS focus not working together

Hi,

I have a form in which there are 2 dropdowns for Country and State respectively (in the middle of the form). When I select a value from the Country dropdown the page refreshes and loads the State dropdown with the relevant state names. I want the page to remain in the same place where it was before refreshing the page (ie., I dont want the page to go to the top after refreshing) and also I want the focus to be on the State dropdown after refershing. For this I created a HTML anchor as below

<a name="cntrystateanchor" />
  <div>
      <select class="small3 formfieldwidth2" name="countryDDList" id="countryDDList" onchange="javascript:getStates();">
    <option value="" selected >- Please Select -</option>
    <% Iterator keys= countrylist.keySet().iterator();
                                   while(keys.hasNext() ){
                                  ........... <% } %>
    </select>
  </div>

When the page is done with refreshing I am doing the following

document.registrationForm.stateDDlist.focus();
document.location = "#cntrystateanchor";

My page is staying at the same place after refreshing but the focus is not getting set to the 'States' dropdown. If I remove the "document.location = "#cntrystateanchor";" the focus is getting set correctly to the 'States' dropdown but as expected the page is going to the top after refreshing (as I removed the document.location).

Can someone please help me with this.

Thanks,
Sudhir
Reply With Quote