How to select hidden dropdown list in selenium webdriver with java?

Question

I am trying to select the item from dropdown in selenium webdriver using java, but not able to select it. Its showing element not found exception and in html tag drop down is hidden. html code are:

  div style="width:49%">
  <select id="menu_id" class="select-block" onchange="showSubmenu(this.value);" style="display: none;">
   <option value="">Select Category</option>
   <option value="1">CASINO</option>
   <option value="2">ACCOMMODATIONS</option>
   <option value="3">DINING</option>
   <option value="4">ENTERTAINMENT & EVENTS</option>
   <option value="5">SPA & FITNESS</option>
   <option value="8">GOLF & SPORTS</option>
   <option value="9">MEETING, WEDDINGS & GROUPS</option>
   <option value="10">PACKAGES</option>
   <option value="11">NIGHTLIFE & LOUNGES</option>
 </select>
<div class="btn-group select select-block">
<i class="dropdown-arrow dropdown-arrow-inverse"/>
<button id="menu_id" class="btn dropdown-toggle clearfix btn-primary" data-toggle="dropdown">
<span class="filter-option pull-left">Select Category</span>
<span class="caret"/>
</button>
<ul class="dropdown-menu dropdown-inverse" role="menu">
<li class="selected" rel="0">
<a class="" href="#" tabindex="-1">
</li>
<li rel="1">
<li rel="2">
<li rel="3">
<li rel="4">
<li rel="5">
<li rel="6">
<li rel="7">
<li rel="8">
<li rel="9">
</ul>
</div>
</div>

These is the script I'm using:

submenu=topbanner.getSelectSubMenuLink(); 

Select se1=new Select(submenu); 

se1.selectByIndex(1)

In the above code I am using object repository concept and path I have written under findby keys.

@FindBy(xpath="//select[@id='menu_id']");
 private WebElement selSubMenuLink;
 public WebElement getSelectSubMenuLink() 

{ 
  return selectSubMenuLink; 
} 

Answer 1

This dropdown select list is linked to the button due to the data-toggle being utilized. In this instance you will actually not want to use the locators for the select list.

To open the drop down you will need to click the button that has a linked id with the select list

<button id="menu_id" class="btn dropdown-toggle...>

Using the locator below

driver.findElement(By.xpath("//button[@id='menu_id']")).click();

The unordered list below the button corresponds to each of the select options

<li rel="NUMBER">

This xpath query can be set to select the desired option.

driver.findElement(By.xpath("//button[@id='menu_id']/..//li[@rel='1']")).click();

or

driver.findElements(By.xpath("//button[@id='menu_id']/..//li")).get(1).click();

You can replace the number in @rel='NUMBER' with the number of the li tag that is linked to your desired select option.

The reasoning behind including the @id='menu_id' within the xpath query instead of just making a direct query is to make it less brittle due the likelihood of other drop downs on the page sharing identical code leaving the id as a unique identifier to latch onto.

Answer 2

The first thing is you have to identify that dropdown:

WebElement dropdown=diver.findElement(By.name(""));
List<WebElement> droplist=driver.findElements(By.tagname("option"));

Then after create select class

Select s=new Select();

then you can use

s.selectByVisibleText("");