I have 2 option in my jsp file. First option comobox,
<select name="firstoption">
<option value="select">-Select-</option>
<option value="apple">APPLE</option>
<option value="android">ANDROID</option>
</select>
and when I select the apple option, the second dropdown will be
<select name="secondoption">
<option value="select">-Select-</option>
<option value="iphone">Iphone</option>
<option value="ipod">Ipod</option>
</select>
If I select the android menu, the second dropdown will be another option list.
can anybody help me with this? thanks. and sorry for my bad english
Related
I have this WebElement:
<select id="month">
<option value="empty">Select</option>
<option value="1">Jan</option>
<option value="2">Feb</option>
<option value="3">Mar</option>
<option value="4">Apr</option>
<option value="5">May</option>
<option value="6">Jun</option>
<option selected="" value="7">Jul</option>
<option value="8">Aug</option>
<option value="9">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>
</select>
And I want to remove the selected attribute from Jul and put this attribute under different Month.
This is what I have tried to remove the Attribute:
(JavascriptExecutor) driver).executeScript("arguments[0].setAttribute('selected', '')", myElement)
In general if you want to remove an attribute use the JavaScript removeAttribute method rather than trying to use setAttribute. In this case, though, you are working with a select and want to select a different element. Just use the built in Select class in selenium like this:
Select select = new Select(myElement);
select.selectByVisibleText("Aug");
I created an HTML file with the following contents and then tested it on that.
<html>
<body>
<select id="month">
<option value="empty">Select</option>
<option value="1">Jan</option>
<option value="2">Feb</option>
<option value="3">Mar</option>
<option value="4">Apr</option>
<option value="5">May</option>
<option value="6">Jun</option>
<option selected="" value="7">Jul</option>
<option value="8">Aug</option>
<option value="9">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>
</select>
</body>
</html>
Then ran the following code:
#Test
public void testFoo() throws Exception {
WebDriver driver = new FirefoxDriver();
driver.manage()
.window()
.maximize();
driver.get("file:///blah/blah/blah/index.html");
Select select = new Select(driver.findElement(By.id("month")));
select.selectByVisibleText("Dec");
Thread.sleep(10_000);
}
The page ended successfully with "Dec" selected.
To deselect an option you can use deselectBy methods
WebElement dropdown = driver.findElement(By.id("month"));
Select select = new Select(dropdown);
select.deselectByVisibleText("Aug");
// or
select.deselectByValue("7");
// or
select.deselectByIndex(8);
// or
select.deselectAll();
And to select another month
select.selectByVisibleText("Feb")
// or
select.selectByValue("2");
See Select class
In my web application, I am working on a screen, where I want to display retrieved data onto the screen. In my screen I have one drop down for "direction". I am setting value of this field from servlet. But I am not getting a way to display the selected option by default in the page.
<select name="indv_adr_mail_st_dir" value="${indv_adr_mail_st_dir}">
<option value="EA">East</option>
<option value="NE">North East</option>
<option value="NO">North</option>
<option value="NW">North West</option>
<option value="SE">South East</option>
<option value="SO">South</option>
<option value="SW">South West</option>
<option value="WE">West</option>
</select>
What is the way to achieve this?
The reason this doesnt work is the <select> tags selected option is designated by placing the selected attribute on a specific option, not by setting the value attribute. For instance
<select name="test">
<option value="yes">Yes</option>
<option selected value="no">No</option> <!-- this is the selected option -->
</select>
For your code you could make this happen by using a ternary operator to optionally place the selected attribute on an option
<select name="indv_adr_mail_st_dir">
<option ${indv_adr_mail_st_dir=="EA"?"selected":""} value="EA">East</option>
<option ${indv_adr_mail_st_dir=="NE"?"selected":""} value="NE">North East</option>
<option ${indv_adr_mail_st_dir=="NO"?"selected":""} value="NO">North</option>
<option ${indv_adr_mail_st_dir=="NW"?"selected":""} value="NW">North West</option>
<option ${indv_adr_mail_st_dir=="SE"?"selected":""} value="SE">South East</option>
<option ${indv_adr_mail_st_dir=="SO"?"selected":""} value="SO">South</option>
<option ${indv_adr_mail_st_dir=="SW"?"selected":""} value="SW">South West</option>
<option ${indv_adr_mail_st_dir=="WE"?"selected":""} value="WE">West</option>
</select>
Here is an example, with set the value Please_select_a_value at the beginning of the rendered select list:
<s:select id="myGuiId" name="myGuiName" headerKey= "0" headerValue="Please_select_a_value" list="mySourceList" />
This generated the following HTML code:
<select name="myGuiName" id="myGuiId">
<option value="0">Please_select_a_value</option>
<option value="1">Value_1</option>
<option value="2">Value_2</option>
<option value="3">Value_3</option>
<option value="4">Value_4</option>
...
<option value="20">Value_20</option>
</select>
Is there a way, to set the value Please_select_a_value at the end of the rendered select list (if I open select list in GUI) without using some tricks in the correspondent Struts action class? Something like this in HTML code:
<select name="myGuiName" id="myGuiId">
<option value="1">Value_1</option>
<option value="2">Value_2</option>
<option value="3">Value_3</option>
<option value="4">Value_4</option>
...
<option value="20">Value_20</option>
<option value="21">Please_select_a_value</option>
</select>
I'm having some trouble verifying that an option is selected in a dropdown. In my application, I have a dropdown with 10 options. If I select option 5, I want to verify that it was actually selected.
Using Firefox and Chrome, its very simple. Below is the HTML for my dropdown and the options.
<select class="Test-field-ddlist" runat="server" onchange="javascript:setTimeout('__doPostBack(\'ctl00$cphMainContent$ctl17\',\'\')', 0)" name="ctl00$cphMainContent$ctl17">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5" selected="selected">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
To verify the selected option, I created an object using the CSS selector. I then verified that the text is equal to 5.
public static final String ManagerPage_DropdownSelection = "css=.Test-field-ddlist option[selected]";
String actualtext = driver.getSingleElement(ManagerPage_DropdownSelection).getText();
Assert.assertEquals(actualtext, "5");
The problem I'm having with IE is that the HTML is different. When I inspect the element, the HTML looks like this. There is nothing that says 5 is selected
<SELECT name=ctl00$cphMainContent$ctl17 class=Test-field-ddlist onchange="javascript:setTimeout('__doPostBack(\'ctl00$cphMainContent$ctl17\',\'\')', 0)" runat="server" sizcache="0" sizset="0">
<OPTION value=1>1</OPTION>
<OPTION value=2>2</OPTION>
<OPTION value=3>3</OPTION>
<OPTION value=4>4</OPTION>
<OPTION value=5>5</OPTION>
<OPTION value=6>6</OPTION>
<OPTION value=7>7</OPTION>
<OPTION value=8>8</OPTION>
<OPTION value=9>9</OPTION>
<OPTION value=10>10</OPTION>
It looks like the "selected" text is hidden. If I copy and past the HTML into a text editor, I can then see the text "selected". Unlike Firefox and Chrome, there is not an attribute of selected. Instead, selected text is added to the value attribute.
<SELECT name=ctl00$cphMainContent$ctl17 class=Test-field-ddlist onchange="javascript:setTimeout('__doPostBack(\'ctl00$cphMainContent$ctl17\',\'\')', 0)" runat="server" sizcache="0" sizset="0">
<OPTION value=1>1</OPTION>
<OPTION value=2>2</OPTION>
<OPTION value=3>3</OPTION>
<OPTION value=4>4</OPTION>
<OPTION value=5 selected>5</OPTION>
<OPTION value=6>6</OPTION>
<OPTION value=7>7</OPTION>
<OPTION value=8>8</OPTION>
<OPTION value=9>9</OPTION>
<OPTION value=10>10</OPTION>
Can I create a selector that will find the selected dropdown option in all browsers? Or is there a better way to verify the selected value of a dropdown? I have tried the below method. It seems to work, but takes a very long time to complete (about 5 minutes).
protected void verifyDropDownSelection(String selector, String expectedvalue) {
List<String> listA = new ArrayList<String>();
listA.add(expectedvalue);
List<String> listB = new ArrayList<String>();
List<Element> DDSelected = driver.getSingleElement(selector).useAsDropdown().getAllSelectedOptions();
for(Element selectedoption : DDSelected) {
String actualtext = selectedoption.getText();
listB.add(actualtext);
}
log.info("INFO: Verifying the selected option in the dropdown");
Assert.assertEquals(listB, listA);
log.info("PASS: "+expectedvalue+" was the selected option in the dropdown");
}
I would let the Select class handle the case:
WebElement select = driver.findElement(By.name("ctl00$cphMainContent$ctl17"));
Select dropDown = new Select(select);
String selected = dropDown.getFirstSelectedOption().getText();
Assert.assertEquals(selected, "5");
i am using struts tag with . there are two opt groups with same keys but different values. when i submit my form, keys go to server to save. now on server side i want to check with which optgroup it was associated how can i do it ?
following is html code
<optgroup label="Group1">
<option value="1">opt1</option>
<option value="3">opt2</option>
<option value="4">opt3</option>
</optgroup>
<optgroup label="Group2">
<option value="1">opt4</option>
<option value="3">opt5</option>
<option value="4">opt6</option>
</optgroup>
Use different values, such as:
<option value="grp1_1">opt1</option>
...
<option value="grp2_1">opt1</option>
Then parse out the value on the server after the for is submitted.