Solved

Set the focus on a user selected item of a dynamic drop down list/combo box

Posted on 2004-09-29
9
232 Views
Last Modified: 2010-05-19
Hi,

I was wondering if there was a way to set the focus on an item selected by the user on dynamic drop down list or combo box? The <option> tag is dynamically picking up the value and text/label from an access database.

I have tried to write a javascript function to try to set the focus, once the user has selected an item (onchange), but it doesn’t work. There might be something wrong with my javascript.  Any help would be much appreciated.

Thanks, ggd.

==================================================================================
Here is my code:
<script language="javascript" type="text/javascript">
function selecteditem()
{
var selectbox=document.faq.chooser.selectedIndex;
}
</script>

<form method="POST" action="faq.asp" name="faq">
              <p>
                 <select name="chooser" id="chooser" onChange="selecteditem()">
                  <%
                        'assumption 2
                        SQL = "Select Chooser FROM faq ORDER BY ID ASC"
                        'assumption 3
                        SET RS = Conn.Execute(SQL)
                        While NOT RS.EOF
                        %>
                  <option selected value="<%=RS("Chooser")%>"><%=RS("Chooser")%></option>
                  <%
                        RS.MoveNext
                        WEND
                        Set RS = NOTHING
                        Conn.Close
                        %>
                </select>
                &nbsp;
                <input type="submit" value="Submit" name="Submit">
              </p>
            </form>


0
Comment
Question by:ggd
  • 4
  • 3
9 Comments
 
LVL 1

Expert Comment

by:mwquek
ID: 12177949
Hi,

   onchange event only fired when the selected item from the drop down list is changed. It will not fired during the time you build the listing.

   You need to have a function called at body onload. You need to remember the Chooser ID in a variable. Then loop through the drop down list to find and match the value. If found update the selected Index as the index you found.

Quek
0
 

Author Comment

by:ggd
ID: 12178080
hi quek,
Thanks for your response. I am not very good at this ... so I was wondering you could give me the code how to do it... and what I have to edit in my existing code?
thanks, ggd
0
 
LVL 1

Accepted Solution

by:
mwquek earned 125 total points
ID: 12178167
You have two options:

1. select the item while building the drop down list:

      <select name="chooser" id="chooser" onChange="selecteditem()">
         <% 'assumption 2
               SQL = "Select Chooser FROM faq ORDER BY ID ASC"
               'assumption 3
               SET RS = Conn.Execute(SQL)
               While NOT RS.EOF
         %>

         <% if rs("chooser") = [your_value] %>
               <option selected="true" value="<%=RS("Chooser")%>"><%=RS("Chooser")%></option>
         <% else %>
               <option value="<%=RS("Chooser")%>"><%=RS("Chooser")%></option>  
         <% end else%>
 
         <%  RS.MoveNext
                WEND
                Set RS = NOTHING
                Conn.Close
          %>
      </select>

2. select the item on body onload method
    function doOnLoad() {
       var f = document.forms[0];
       for (var i=0; i < f.chooser.length; i++) {
          if (f.chooser[i].value == [your_value]) {
             f.chooser.selectedIndex = i; //select the selected item from the drop down list.
             break; //quit the loop when find the selected item.
          } //end if  
       } //end for
    } //end function

    add the following method into your HTML body tag.
    <body onload="doOnLoad()">

   Hope this will help.

/Quek
0
How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

 

Author Comment

by:ggd
ID: 12178480
Hi Quek,

I have a question. Does the destination page have to be different from the initial (FAQ) page with the drop down list? Cause the way i have it currently is the drop down list and the results page are the same.

I tried both options.

In the first option for some reason it gives me an error that says "expected then" after the line "While NOT RS.EOF"

In the second option, nothing happens. Is this because like I was asking both the drop down list and the results are in the same page ? or do I have to edit any part of the code you have sent to me?

Thanks in advance for you help. ggd


0
 
LVL 1

Expert Comment

by:mwquek
ID: 12186176
Yes, you need to replace [Your_value] to the actual chooser value you get in option 1 and option 2. The Options 1 syntax may be incorrect.

If not mistaken, please change the if condition to <% if ..... then %>.

/Quek.
0
 

Author Comment

by:ggd
ID: 12214743
Hi Quek,

I dont know why but neither option works... I edited the code as you said :

option 1:
<select name="chooser" id="chooser">
               <% 'assumption 2
               SQL = "Select Chooser FROM wtvfaq ORDER BY ID ASC"
               'assumption 3
               SET RS = Conn.Execute(SQL)
               While NOT RS.EOF %>    

                     <% if rs("chooser") = What is WTV? then %>

               <option value="<%=RS("Chooser")%>"><%=RS("Chooser")%></option>
                      <%else%>
                     <option value="<%=RS("Chooser")%>"><%=RS("Chooser")%></option>  
                        <% End If%>

         <%  RS.MoveNext
                WEND
                Set RS = NOTHING
                Conn.Close
          %>
      </select>

-------------------
OPTION 2:

function doOnLoad() {
       var f = document.forms[0];
       for (var i=0; i < f.chooser.length; i++) {
          if (f.chooser[i].value == What is WTV?) {
             f.chooser.selectedIndex = i; //select the selected item from the drop down list.
             break; //quit the loop when find the selected item.
          } //end if  
       } //end for
    } //end function

</script>

<body bgcolor="#CCCCCC" onload="doOnLoad()">

Any ideas? Thanks, gdd
0
 
LVL 1

Expert Comment

by:mwquek
ID: 12215978
make sure you are compare the choose value with the id, not the text. If the "what is WTV?" is the value please quote it.
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

Preface This is the third article about the EE Collaborative Login Project. A Better Website Login System (http://www.experts-exchange.com/A_2902.html) introduces the Login System and shows how to implement a login page. The EE Collaborative Logi…
Shoutout to Emily Plummer (http://www.experts-exchange.com/members/eplummer26.html) for giving me this article! She did most of it, I just finished it up and posted it for her :)    Introduction In a previous article (http://www.experts-exchang…
Viewers will learn about the regular for loop in Java and how to use it. Definition: Break the for loop down into 3 parts: Syntax when using for loops: Example using a for loop:
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

708 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

18 Experts available now in Live!

Get 1:1 Help Now