I am showing Category and Sub category in a drop down box and I don't want the drop down value of the main category to be selected by any user.
So I applied disable="disabled" and it works fine in Firefox, Chrome, and also IE8, but it is not working in IE6 and IE7.
my code:
<option value="test" disabled="disabled" >Test></option>
It seems this is a well documented problem with IE6/IE7.
A quick Google search revealed this potential workaround:
http://www.goodercode.com/wp/disable-select-options-internet-explorer-jquery/
I don't think you can achive this in IE. What you can do is to use a little javascript to tell the user that the option is disabled:
function check(el) {
if (el.options[el.selectedIndex].disabled) {
alert ("This option is not available!")
el.options.value = '';
}
}
Also check this solution: http://www.lattimore.id.au/2005/07/01/select-option-disabled-and-the-javascript-solution/
You can put "Category" and "Subcategory" into <optgroup> like this:
<select>
<optgroup label="Category"></optgroup>
</select>
or
<select>
<optgroup label="Category">
<option>Category 1</option>
<option>Category 2</option>
</optgroup>
</select>
is supported in IE5.5
See http://reference.sitepoint.com/html/optgroup for details.
Related
Here is the html:
<select>
<option value="" disabled="disabled">Select segment</option>
<option value="EQ">Equity</option>
<option value="NSE-FO">Futures & Options</option>
<option value="NSE-CDS">Currency</option>
<option value="MCX-COM">Commodity</option></select>
</select>
I have tried to use xpath, select, etc. But I can't seem to find a way to click this box and subsequently click the required option.
Things I tried:
driver.find_element_by_xpath("//*[contains(text(),'Segment']")
driver.find_element_by_xpath("//select[contains='Segment']")
driver.find_element_by_xpath("//select[#label='Segment'") #I can see why this wouldn't work
Thanks for your help.
You have a typo in your xpath
driver.find_element_by_xpath("//*[contains(text(),'Segment']")
should be
driver.find_element_by_xpath("//*[contains(text(),'Segment')]")
You can obtain the select with the options, with this path:
".//option[#value='NSE-FO']/ancestor::select"
If you have more selects with this option, try to find a unique option for this select.
And if this select is inside other select, and the ancestor method returns more than one, I'm not sure if this scenario is possible, you can try with this other:
".//option[#value='NSE-FO']/../../select"
I'm trying to build a data scraper with Selenium Python that searches a webpage. The search page contains a dojoComboBox that allows you to select a name from a dropdown list.
Here is the HTML for the dojoComboBox:
<span _="whitespace and CR's between tags adds in FF" class="dojoComboBoxOuter dj_khtml dj_safari dropSel" style="null">
<input style="display:none" tabindex="-1" name="txtCaseName" value="" dojoattachpoint="comboBoxValue">
<input style="display:none" tabindex="-1" name="txtCaseName_selected" value="" dojoattachpoint="comboBoxSelectionValue">
<input type="text" autocomplete="off" class="dojoComboBox dropSel" dojoattachevent="key:_handleKeyEvents; keyUp: onKeyUp; compositionEnd; onResize;" dojoattachpoint="textInputNode" style="null">
<img hspace="0" vspace="0" class="dojoComboBox dropSel" dojoattachpoint="downArrowNode" dojoattachevent="onMouseUp: handleArrowClick; onResize;" src="dojo/src/widget/templates/images/combo_box_arrow.png" style="width: 13px; height: 13px;">
</span>
I can get the DojoComboBox scroll menu to open with the following code:
dropdown = browser.find_element_by_css_selector("img.dojoComboBox")
dropdown.click()
However, I can't seem to find a way to actually select one of the values.
Update:
The HTML I posted above is from the page I pull up when I inspect elements (the HTML under the 'Elements' tab of Chrome DevTools). I've been looking at some other files that I found in the 'Source' tab, and I found some code in a page called main.aspx?e=nauqov2blnhlnh45eseztnao that looks also related to the DojoComboBox:
<select name="txtCaseName" id="txtCaseName" class="dropSel"dojotype="ComboBox"
setSelectedValue="dojo.byId('txtCaseName1').value=arguments[0]"
autocomplete="true" dataurl="CaseCode.aspx?match=%{searchString}&lang=e"
mode="remote" maxlistlength="7">
</select>
However, neither of these seem to encode options that I can select. I thought that perhaps the options would be stored in the url labeled 'dataurl' in the piece of HTML above, but when I copy that link into my address bar, it doesn't take me to a valid webpage. From what I've found in the Dojo documentation, it seems like the options should be stored in a separate file/database, but I can't find any suggestions about how to access that file.
Any suggestions? (Thanks!)
you will have to store every options in a list. Then based on some conditions such as name of option, you can choose it and click on it.
all_options = browser.find_elements_by_css_selector("your locator for every options")
for options in all_options:
if "option_name" in options.text.strip():
options.click()
I have struggling to set a font-awesome icon in the select drop-down menu in vuejs. I have tried some ways like
<option selected value="fa fa-github"><i class="fab fa-github">
</i>Github</option>
But it didn't work. please help me to solve this issue.
You can't put an <i> tag inside an <select> you can use the unicode directly inside the select and set the font with css.
HTML:
<select>
<option selected value="fa fa-github">Github </option>
</select>
CSS:
select {
font-family: 'Font Awesome\ 5 Brands' , 'arial'
}
Example on this jsfiddle(font awesome 5):
https://jsfiddle.net/68avuypL/
I'm using Protractor to run an automated script, on one of the pages there are two drop down menus that are located below/above each other. The two of them seem identical only that they have different ng-model names etc. I can sucessfully select an element from one of the drop down menus but I can't for the other. It's kind of wrecking my head as to why one works and the other doesn't. Here is the code for the drop down menu where I can select an element
<select class="form-control ng-pristine ng-invalid ng-invalid-required" ng-model="user.sourceOfFunds" required="" ng-class="{submitted:invalid}">
<option value="">Select</option>
<option value="Savings">Deposit</option>
<option value="Inherited">Current</option>
<option value="Other">Savings</option>
</select>
element(by.model('user.sourceOfFunds')).sendKeys('Savings');
My other dropdown menu is as follows:
<select class="form-control ng-pristine ng-invalid ng-invalid-required" ng-model="user.investFigure" required="" ng-class="{submitted:invalid}">
<option value="">Select</option>
<option value="<20">Less than 20K</option>
<option value="20-50">20K-50K</option>
<option value="50-100">50K-100K</option>
</select>
element(by.model('user.investFigure')).sendKeys('Less than 20K');
or
element(by.model('user.investFigure')).sendKeys('20');
I get "element not found" when I try to select an item from the second drop down menu. I'm at a bit of a loss as to why this is happening
Using sendKeys to select a dropdown option seems odd to me, even if it works. Given #alecxe's fine suggestions, perhaps the issue is visibility, but try another way and see if sendKeys is your issue.
I use this code on tests with multiple selects every day without issue. Maybe it'll work for you...
var selectOptionByText = function(text) {
return element(by.cssContainingText('option', text)).click();
};
Call thusly...
selectOptionByText('Less than 20');
selectOptionByText('20');
I need to have a combobox on my Lotus Notes Page that I open in WEB...
<input list="myList" name="myList">
<datalist id="myList">
<option value="item 1">
<option value="item 2">
<option value="item 3">
<option value="item 4">
<option value="item 5">
</datalist>
<input type="submit">
as option values (list of items) I want to pull data from some Notes view.
Any ideas?
Thanks
Here is how you can do it (just one way)
<input list="myList" name="myList">
<datalist id="myList">
<computed text>
</datalist>
<input type="submit">
And computed text must have a formula (with #DbColumn) that generate options. This code just an example.
You will need to define view_name, column_number and possible database (if the view is in another database).
_col := #DbColumn(""; ""; "All"; 2);
_options := "<option value=\""+_col+"\">";
#Implode(_options; #NewLine)
Here is a result (my view has only 2 values, 'index' and 'test'):
Also keep in mind that there is a limit (64Kb if I remember correctly) for result of #dbcolumn.
You could also do a more advanced solution, if you want a fancy combobox.
Use a jQuery plugin that support Ajax/JSON for the choices, and then create a Lotusscript agent on the server that return the values.
If you look at this presentation you perhaps get some ideas.
I have used that method in some applications, you get nice features like type-ahead, sorting and much more for free there.