Solved

how to open dropdown menu on page load without having to click?

Posted on 2016-09-23
4
87 Views
Last Modified: 2016-10-10
On a page, I have a dropdown. I want it to open when page loads. Thanks for your help.

Here is my drop down code:


<select name="pgnames" align="absmiddle" onChange="nav()" onload="toggle()">
<option value="">--- By Practice Group ---</option>
<cfoutput query="getPGNames"><option value="#pgnumber#"<cfif isdefined("pg")><cfif pg EQ #pgnumber#> selected</cfif></cfif>>#PracticeGroup#</option></cfoutput>
</select>
0
Comment
Question by:Member_2_7971128
  • 2
4 Comments
 
LVL 42

Accepted Solution

by:
zephyr_hex (Megan) earned 500 total points (awarded by participants)
ID: 41812663
One way to do this would be to change the size attribute of the select.  Here is a simple demo:

JS Fiddle Demo

HTML
<div>
  <select id="mySelect">
    <option>Select Me!</option>
    <option>Foo</option>
    <option>bar</option>
  </select>
</div>
<div>
  <input type="button" id="myBtnOpen" class="myBtn" data-size="3" value="Open It!">
  <input type="button" class="myBtn" data-size="1" value="Close It!">
</div>

Open in new window


jQuery
$('.myBtn').on('click', function() {
  $('#mySelect').attr('size', $(this).data('size'));
});

$('#myBtnOpen').click();

Open in new window

0
 
LVL 42

Expert Comment

by:zephyr_hex (Megan)
ID: 41827240
Did this answer your question?
0
 

Author Comment

by:Member_2_7971128
ID: 41837247
I am really sorry I was away. I gave it a try. No it didn't work.
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

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

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
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 position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

831 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