I am trying to extract some information from an html page. Consider the drop down select list below:
<select name="ctl00$MainContent$ddlColor" onchange="chageColor(this);setTimeout('__doPostBack(\'ctl00$MainContent$ddlColor\',\'\')', 0)" id="ctl00_MainContent_ddlColor" class="input" style="width:175px;">
<option selected="selected" value="">Color</option>
<option value="00114743-03|large|0|03">CHARCOAL</option>
<option value="00114743-04|large|2|04">BLACK</option>
</select>
It has 3 values, "Color", "CHARCOAL" and "BLACK".
Now if I view the source and copy XPATH of "CHARCOAL" using google chrome, I get
//*[#id="ctl00_MainContent_ddlColor"]/option[2]
However, I want to extract the information as "CHARCOAL" and "BLACK". I want this to be applied on multiple pages where the drop down list might contain more or less number of elements. However, I always want to skip the first element, which will be "Color". How to do this ?
Here you are ..
//select/option[not(contains(., 'Color'))]/text()
You can skip the first option by it's position by this
//select/option[position() > 1]/text()
I hope this could help
Related
Hello Guys I Have select and many options and i have input inside on of these options and i want to set default value for it. My Code is bellow
<label for="cars">Choose a car:</label>
<select name="cars" id="cars" class='select2'>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
i want to set default value for input id = 'searchfor'.
i tried this code bellow but it doesn't work
<select name="cars" id="cars">
<input id='searchfor' type='search' value='car1' placeholder='search for your car'>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
when i open the select i don't see the value for this input
You cannot put an text input element inside a select element
Using MDN as a reference, https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select the only permitted content for a select element is;
Zero or more <option> or <optgroup> elements.
So it is not valid html for a select input element to itself contain an input element
See also for info;
Put input inside select
For code like below:
<div class="col-xs-4 col-sm-4 col-md-4 select-me show_me del_nxt" style="display: block;">
<select class="prime" name="primary" id="primary" onchange="newsecondary(this)">
<option value="none" id="1200">---Select main---</option>
<optgroup label="dummy1">
<option value="abc-2-1">abc</option>
<option value="xyz-2-1">xyz</option>
</optgroup>
<optgroup label="Dummy2">
<option value="abc1-2-1">abc1</option>
<option value="C1-2-1">C1</option>
<option value="D1-2-1">D1</option>
</optgroup>
</select>
<span class="Error"></span>
</div>
How to capture random value from dropdown list? thanks in advance.
Scenario is we have 4 drop downs with same type of html code as above.
Unless user selects any value from first drop down, another wont get enabled. this is how these 4 dropdowns are dependant on previous dropdown value .
Since content is html, the most maintainable way is to use CSS Selector Extractor based on this syntax:
Configuration would be the following:
You may use Regular Expression Extractor added to your request.
With the Regular Expression:
option value="([a-zA-Z0-9])+"
To ectract random value you need to set Match No to 0 as shown below
You may test your RegExp here regexr.com
Read more about Regular Expressions
If you want to select a random value and forget - go for HTML Links Parser
If you need the selected value anywhere else - you can extract it using i.e. XPath Extractor, it allows executing arbitrary XPath queries.
Get text of the selected option:
//select/optgroup/option/#selected/parent::*/text()
Get all options for optgroup with the label of dummy1
//select/optgroup[#label='dummy1']/option/#value
etc.
I'm trying to select option 2, but first it is selecting 2 then changing to 1.
This is the HTML of the select list:
<select id="IDITForm#additionalVehicleDrivers|1#youngestDriverExperienceVO#id">
<option style="background-color: rgb(252, 218, 175);" value="-1">Select</option>
<option value="1">0</option>
<option value="2">1</option>
<option value="3">2</option>
<option value="4">3</option>
<option value="5">4</option>
<option value="1000000">5</option>
<option value="1000001">more than 5</option>
</select>
This is the Watir code for selecting 2:
b.select_list(:id,"IDITForm#additionalVehicleDrivers|1#youngestDriverExperienceVO#id").select "2"
The problem is that you are using Watir-Classic's select method with a parameter that matches both an option's text as well as another option's value.
If you take a look at the code for the Watir::SelectList#select method:
def select(item)
matching_options = []
perform_action do
matching_options = matching_items_in_select_list(:text, item) +
matching_items_in_select_list(:label, item) +
matching_items_in_select_list(:value, item)
raise NoValueFoundException, "No option with :text, :label or :value of #{item.inspect} in this select element" if matching_options.empty?
matching_options.each(&:select)
end
first_present_option_value matching_options, :text
end
You can see that:
It gets a list of matching options based on text, label and value and
Then for each matching option Watir-Classic selects it.
For your specific example, this means that
2 options match the input "2":
<option value="2">1</option> matches since its value is "2"
<option value="3">2</option> matches since its text is "2"
Watir-Classic is selecting each of these options, in this specific order, which is why you see the dropdown switch to "1" and then "2"
Given the way the method is written and how your select list is written, you cannot use the select method. While the best choice is to move to Watir (previously Watir-Webdriver), there are workarounds in Watir-Classic.
Remove the ambiguity by specifically selecting an option based on only the value attribute:
id = "IDITForm#additionalVehicleDrivers|1#youngestDriverExperienceVO#id"
b.select_list(:id, id).select_value "3"
#=> will select <option value="3">2</option>
If you want to stick to selecting by text, directly locate/select the option element:
id = "IDITForm#additionalVehicleDrivers|1#youngestDriverExperienceVO#id"
b.select_list(:id, id).option(:text, "2").select
#=> will select <option value="3">2</option>
For Watir, you can use index based options where you need to worry about index only. Such as for:
<option value="2">1</option>
We can use,
browser.select_list(id: 'IDITForm#additionalVehicleDrivers|1#youngestDriverExperienceVO#id').options[2].select
As it is the 3rd index of given select_list and it follows zero based index ordering. Similarly for,
<option value="3">2</option>
We can use
browser.select_list(id: 'IDITForm#additionalVehicleDrivers|1#youngestDriverExperienceVO#id').options[3].select
As it is the 4th index of given select_list.
#select matches the text.
If you want to select by value you need to use #select_value:
b.select_list(id: "IDITForm#additionalVehicleDrivers|1#youngestDriverExperienceVO#id").select_value "2"
For the following XMl file,
<select id="pet" title="Pet" class="x8" onchange="" name="pet">
<option></option>
<option selected="" value="abc">Dog</option>
<option value="def">Cat</option>
<option value="ghi">Rabbit</option>
</select>
What is the Xpath to be able to get the value of the option with "Selected" property? (I need to get "abc")
One possible way to get value attribute of option element having selected attribute :
/select/option[#selected]/#value
That would take all options
/select/option
That would take 2-nd option and read value attribute from it.
/select/option[2]/#value
So I have a dropdown and I am using angular to build it. Minutes is an array of numbers [0,1,2....59]. The filter is a simple filter that displays the digits from 0-9 as 00, 01... etc.
<select ng-model="addObj.StartMinute"
ng-options="m as m | pad2Digit for m in Minutes"
required
name="startMinute">
<option value="">-- select --</option>
</select>
My problem is that this ALWAYS reports being valid. I have removed the option in there that lets me customize the option used when no match is found, and that doesn't change it. I have tried setting StartMinute to null, -1 and undefined and still the select ALWAYS says it is valid.
I have found so far that the problem has to do with my using simple numbers rather than binding to objects. In cases where I am doing a dropdown with more a collection of objects, required validation is correctly detecting that nothing is chosen. I would have thought that setting the initial value on the above dropdown to null would work, but it isn't. So does anyone know how to use required validation on a dropdown that is bound to an array of numbers?
There must be something else on the project where it wasn't working making this not work because the raw jsfiddle I threw together to try to demo the problem works properly. If the initial value is null, then the validation does fail like I would expect.
HTML
<div ng-app="app">
<div ng-controller="ctrlDropdown">
<form name="testForm">
<select ng-model="number1"
ng-options="num for num in numbers"
required
name="ddl1">
<option value="">- select - </option>
</select>
<br/>failsValidation: {{testForm.ddl1.$error.required}}
</form>
</div>
</div>
JS
var app = angular.module("app",[]);
app.controller("ctrlDropdown",function($scope){
$scope.test = "wee";
$scope.number1 = null;
$scope.numbers=[1,2,3,4,5,6];
});
http://jsfiddle.net/NBhTT/