option tag not shown in firefox - dojo

I have the following code in html:
<select>
<option text="item9" value="9"></option>
<option text="item10" value="10"></option>
</select>
The select shows up as blank in firefox. There are no elements. But it works in IE. The following works in both:
<select>
<option text="item9" value="9">item9</option>
<option text="item10" value="10">item10</option>
</select>
I am using the following dojo code to create the dropdown:
dojo.byId("sel1").add(dojo.create("option", { text:optionText, value:docNode.childNodes[i].getAttribute("id") }));
How do I create
<option text="item9" value="9">item9</option>
with dojo?

All you really need is:
<select>
<option value="9">item9</option>
<option value="10">item10</option>
</select>
The text attribute is non-standard.
You can use:
dojo.byId("sel1").add(dojo.create("option",{
innerHTML:optionText,
value:docNode.childNodes[i].getAttribute("id")
}));

Related

How to make materializecss dropdown appear below selectbox?

I am using materilizecss and i have the following dropdown:
<select class="txtInput" data-val="true" data-val-number="The field SelectedAssetCategoryId must be a number." data-val-required="Select a asset category" id="ddlAssetCategory" name="SelectedAssetCategoryId"><option value="">Asset Category</option>
<option value="1">Disease State/Condition Training</option>
<option value="5">Hot Topics Training</option>
<option value="6">Launch Training</option>
<option value="7">Medical Meetings</option>
<option value="2">Product Training</option>
<option value="8">Quiz</option>
<option value="4">Real World Evidence/HEOR Training</option>
<option value="3">Treatment/Competitive Landscape Training</option>
</select>
I was initilizing it like so:
$("select").not('[multiple="multiple"]').formSelect({
});
But what i wanted was the dropdown to show below the selectbox not above , so i added the below line of code:
$("select").not('[multiple="multiple"]').formSelect({
belowOrigin: true
});
But even this does't seem to work , What option can i add so that the dropdown menu shows below the select box ?
Use This :
$("select").not('[multiple="multiple"]').formSelect({
dropdownOptions: {coverTrigger: false}
});
Instead of :
$("select").not('[multiple="multiple"]').formSelect({
belowOrigin: true
});
JSFiddle
Actually with dropdownOptions you can pass dropdown options to select form.

How to retrieve the value of options from a select drop-down using Selenium?

In the given code, I need the list of the value of the "value" attribute for each of the options in the select drop-down :
<select id="myselect">
<option value="val1">Some Text</option>
<option value="val2">Some Text</option>
<option value="val3">Some Text</option>
<option value="val4">Some Text</option>
<option value="val5">Some Text</option>
<option value="val6">Some Text</option>
</select>
I want the list of all the values, which is
{val1,val2,val3,val4,val5,val6}
To create a List of all the values of the value attribute for each of the options with in the <select> tag you can use the following Java based solution:
Select dropDownSelect = new Select(driver.findElement(By.id("myselect")));
List<WebElement> dropDownActualValues = dropDownSelect.getOptions();
for(WebElement element:dropDownActualValues)
System.out.println(element.getAttribute("value"));

Angular 5 dropdown setting default value

I am trying to preselect (set as default) value from Angular 5 drop down.
There are three values and I am trying to set the second one with this code but it doesn't work. I can't make any changes in the component, only in the template.
<select [(ngModel)]="declaration.media" name="media" (change)="onChangeMedia()" class="form-control form-control-sm" required>
<option *ngFor="let media of mediaArray" value="{{media.value}}" selected = "{{media.value == '02'}}">{{media.text}}</option>
</select>
UPDATE: if I remove [(ngModel)] then it works, but no two way binding.
<select>
<option value="" selected disabled hidden>Choose here</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
<option value="5">Five</option>
</select>

VBA IE11 locking in a change to a dropdown value

I'm using VBA to open a website, login, and navigate to a certain page. There is a dropdown with 8 options.
I used this code to change the dropdown to the value I want, but it always reverts back to the default as I continue. How do I lock this change in?
Set Element = IE.Document.getElementsByName("date_range")
Element.Item(0).Value = "custom"
Here's the page code:
<div class="SelectInput">
<select class="SelectInput-select" name="date_range">
<option value="all_time">All Time</option>
<option value="today">Today</option>
<option value="yesterday">Yesterday</option>
<option value="this_month">Month to date</option>
<option value="last_month">Last Month</option>
<option value="this_year">Year to date</option>
<option value="last_year">Last year</option>
<option value="custom">Between...</option>
</select>
<div class="SelectInput-arrows">...</div>
</div>
Thanks,
you need to set the selected attribute .... ref: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_option_selected

Cannot select item from drop down in Selenium IDE

I'm writing a Selenium script that containing a drop down list.
<select id="seats" class="form-control" name="seats">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="3">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>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">22</option>
<option value="23">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
</select>
I've looked several answers in stack overflow to select a value form dropdown box and every time I failed. Even tried to get xpath from Selenium IDE. in that case I got same Relative XPath to both dropdown and the value.
Here is the code I'm currently using.
driver.findElement(By.id("seats")).click();
driver.findElement(By.xpath("//form[#id='side-form']/div/div/div/div/div[3]/div/select")).click();
Here what i need to select is 4. but, it selecting 1.
Can someone tell me how to select 4 from my dropdown. Any help would be appreciated.
Thanks in advance. :)
It is a bit awkward that your dropdown has 2 options with the same value. Anyway, here is one possible XPath which will return the last option of certain value, from dropdown with id equals 'seats' :
driver.findElement(By.xpath("//select[#id='seats']/option[#value='3'][last()]")).click();
Please try below sample
new Select(driver.findElement(By.id("seats"))).selectByValue("4");
Edit
WebElement select = driver.findElement(By.id("seats"));
List<WebElement> allOptions = select.findElements(By.tagName("option"));
for (WebElement option : allOptions) {
if(option.getText().equals("4")){
option.click();
}
}