How to Select an element from dropdown menu using selenium web driver with java?

Question

<div class="select-dropdown-icon"
	ng-mousedown="onDropdownBtnMousedown()"></div>

<div class="select-dropdown" ng-click="onDropdownClick($event)"
	style="display: block;">
	<div class="select-contents-container ng-isolate-scope"
		kt-scrollpane="" on-infinite-scroll="onInfiniteScroll()"
		ng-transclude="">
		<kt-select-option value="off_duty" class="ng-scope ng-isolate-scope">
			<div class="select-option-container select-option-highlighted"
				ng-mouseenter="onMouseenter()" ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="" style="">
				<span class="ng-scope">Off Duty</span>
			</div>
		</kt-select-option>
		<kt-select-option value="sleeper" class="ng-scope ng-isolate-scope">
			<div class="select-option-container select-option-selected"
				ng-mouseenter="onMouseenter()" ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="">
				<span class="ng-scope">Sleeper</span>
			</div>
		</kt-select-option>
		<!-- ngIf: !logSuggestions.log.isEldEnabled -->
		<kt-select-option value="driving"
			ng-if="!logSuggestions.log.isEldEnabled"
			class="ng-scope ng-isolate-scope">
			<div class="select-option-container" ng-mouseenter="onMouseenter()"
				ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="" style="">
				<span class="ng-scope">Driving</span>
			</div>
		</kt-select-option>
		<!-- end ngIf: !logSuggestions.log.isEldEnabled -->
		<kt-select-option value="on_duty" class="ng-scope ng-isolate-scope">
			<div class="select-option-container" ng-mouseenter="onMouseenter()"
				ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="" style="">
				<span class="ng-scope">On Duty</span>
			</div>
		</kt-select-option>
	</div>
</div>

Please check the code and let me know how to access the dropdown menu and select an element. Elements being " on duty" "sleeper" "off duty"

Given html only displays the word driving. without any dropdown menu. Can you share some more details on HTML. Also where exactly is the problem? — MKay
– MKay, Commented Nov 4, 2015 at 5:49
I have edited the HTML can you please have a look. I am new to HTML and selenium so i have problem accessing the main dropdown menu and than selecting any of one options " off duty" "sleeper" "on duty", I want to select any option of the following.@mk08 — Shah
– Shah, Commented Nov 4, 2015 at 6:07
There is something missing in your edit. Can you share the URL instead? — MKay
– MKay, Commented Nov 4, 2015 at 6:09
Please check your Edited code.HTML is code is never been like this — Sagar007
– Sagar007, Commented Nov 4, 2015 at 6:14

StrikerVillain · Accepted Answer · 2015-11-04 08:38:51Z

If your are familiar with HTML, you would know that dropdowns are implemented traditionally with the Select tag. Selenium WebDriver provides a Class to handle such select(s).

Select select = new Select(driver.findElement(By.id("select")))

However, the newer websites developed using jQuery Bootstrap and other technologies implement this differently using spans, divs, li and other tags. Your code is also developed in this way. So we have to follow the following approach. Usually, the drop down and drop down values are located in different parts of DOM. We have to correctly identify it by checking the page source.

Click on the drop down box and wait for the drop down values to appear

WebElement dropDown = driver.findElement(By.className("select-dropdown-icon"));
dropDown.click();

Select the required drop down value by clicking on it.

WebElement dropDownValueOffDuty  = driver.findElement(By.xpath("//kt-select-option[@value='off_duty']/div"));
dropDownValueOffDuty.click();

I hope this helps you.

Collectives™ on Stack Overflow

How to Select an element from dropdown menu using selenium web driver with java?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related