Reputation: 217
I am trying to select an option within a dropdown. I am not able to use a select since I dont have a select ID. Because then I get the message expected select got button.
I am able to open the dropdown with:
[FindsBy(How = How.XPath, Using = "//button[@data-id='Product_Contractor_Person_Contact_Country']")]
private IWebElement CountryDropdownElement { get; set; }
My code looks as follow:
<div class="col-lg-4 form-group">
<label>
Land
</label>
<label class="select select-block">
<select class="selectpicker" data-width="100%" id="Product_Contractor_Person_Contact_Country" name="Product.Contractor.Person.Contact.Country" style="display: none;">
<option selected="selected" value="NL">Nederland</option>
<option value="BE">Belgie</option>
<option value="FR">Frankrijk</option>
<option value="UK">Engeland</option>
<option value="DE">Duitsland</option>
<option value="SE">Zweden</option>
<option value="ES">Spanje</option>
<option value="IT">Italie</option>
<option value="ZA">Zuid Afrika</option>
<option value="PL">Polen</option>
<option value="UA">Oekraïne</option>
<option value="ID">Indonesië</option>
<option value="HU">Hongarije</option>
<option value="PT">Portugal</option>
</select>
<div class="btn-group bootstrap-select" style="width: 100%;">
<button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="Product_Contractor_Person_Contact_Country" title="Nederland"><span class="filter-option pull-left">Nederland</span> <span class="caret"></span></button>
<div class="dropdown-menu open">
<ul class="dropdown-menu inner selectpicker" role="menu">
<li rel="0" class="selected"><a tabindex="0" class="" style=""><span class="text">Nederland</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="1"><a tabindex="0" class="" style=""><span class="text">Belgie</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="2"><a tabindex="0" class="" style=""><span class="text">Frankrijk</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="3"><a tabindex="0" class="" style=""><span class="text">Engeland</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="4"><a tabindex="0" class="" style=""><span class="text">Duitsland</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="5"><a tabindex="0" class="" style=""><span class="text">Zweden</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="6"><a tabindex="0" class="" style=""><span class="text">Spanje</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="7"><a tabindex="0" class="" style=""><span class="text">Italie</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="8"><a tabindex="0" class="" style=""><span class="text">Zuid Afrika</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="9"><a tabindex="0" class="" style=""><span class="text">Polen</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="10"><a tabindex="0" class="" style=""><span class="text">Oekraïne</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="11"><a tabindex="0" class="" style=""><span class="text">Indonesië</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="12"><a tabindex="0" class="" style=""><span class="text">Hongarije</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
<li rel="13"><a tabindex="0" class="" style=""><span class="text">Portugal</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li>
</ul>
</div>
</div>
</label>
</div>
In am using selenium webdriver with c#.
Upvotes: 1
Views: 2431
Reputation: 5347
Please try the following code. I have it in java.
//click on dropdown
driver.findElement(By.xpath("//button[@data-id='Product_Contractor_Person_Contact_Country']")).click();
//select option
List<WebElement> lstOptions= driver.findElements(By.xpath("//ul[contains(@class,'selectpicker')]/li/a/span"));
selectOption(lstOptions, "Zweden");
public boolean selectOption(List<WebElement> lstOptions,String option){
boolean isOptionAvailable=false;
for(WebElement eleOptions:lstOptions){
if(eleOptions.getText().trim().equals(option.trim())){
isOptionAvailable=true;
eleOptions.click();
break;
}
}
return isOptionAvailable;
}
Upvotes: 1
Reputation: 223
You'll first have to click the button so the item is visible. This can be done through an action. See for a reference on how to build click actions.
Not an exact match but shows how it could be done: Nested Hover in Selenium C#
Upvotes: 0