xxx2017
xxx2017

Reputation: 217

Selenium-webdriver help needed with selecting dropdown without select option

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>&nbsp;<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

Answers (2)

Murthi
Murthi

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

Jens Stragier
Jens Stragier

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

Related Questions