How to select the <option> element with the "value" attribute in the <select> drop-down list?
In my Delphi application, I use the TWebBrowser control, where I loaded an HTML document containing a <select> element (drop-down list) with several <option> elements (drop-down lists). Let's say I have the following HTML document loaded in my web browser:
<html> <body> <select id="ComboBox"> <option value="firstvalue">First Value</option> <option value="secondvalue">Second Value</option> <option value="thirdvalue">Third Value</option> </select> </body> </html> How can I programmatically select, for example. <option> whose value thirdvalue attribute? Or, in other words, how can I programmatically select the third item in this drop-down list when I only know that this attribute is value thirdvalue ?
You can use the IHTMLSelectElement interface with selectedIndex , for example. As a showcase, I performed the following function.
SelectOptionByValue Function
The following function tries to find and select (if found) the <option> (drop-down list) of the specified value of the value attribute in the specified <select> element (drop-down list). If no <option> found, the current drop-down list is cleared (no item selected).
Parameters:
- ADocument - Interface for HTML input document
- AElementID - identifier of the element
<select>(identifier of the element of the drop-down list) - AOptionValue - search for the value of the
<option>element (value of the drop-down list element)
Return value:
If <option> with the given value successfully found (and selected), the return value is the index of this option in the specified drop-down list, otherwise -1. A.
Source:
function SelectOptionByValue(const ADocument: IDispatch; const AElementID, AOptionValue: WideString): Integer; var HTMLDocument: IHTMLDocument3; HTMLElement: IHTMLSelectElement; function IndexOfValue(const AHTMLElement: IHTMLSelectElement; const AValue: WideString): Integer; var I: Integer; begin Result := -1; for I := 0 to AHTMLElement.length - 1 do if (AHTMLElement.item(I, I) as IHTMLOptionElement).value = AValue then begin Result := I; Break; end; end; begin Result := -1; if Supports(ADocument, IID_IHTMLDocument3, HTMLDocument) then begin if Supports(HTMLDocument.getElementById(AElementID), IID_IHTMLSelectElement, HTMLElement) then begin Result := IndexOfValue(HTMLElement, AOptionValue); HTMLElement.selectedIndex := Result; end; end; end; Using an example:
To select an element with a thirdvalue value in the drop-down list from an HTML document from a question that it can use for this code (it is assumed that this document is loaded in the WebBrowser1 component):
procedure TForm1.Button1Click(Sender: TObject); var Index: Integer; begin Index := SelectOptionByValue(WebBrowser1.Document, 'ComboBox', 'thirdvalue'); if Index <> -1 then ShowMessage('Option was found and selected on index: ' + IntToStr(Index)) else ShowMessage('Option was not found or the function failed (probably due to ' + 'invalid input document)!'); end; An example HTML document from a question:
<html> <body> <select id="ComboBox"> <option value="firstvalue">First Value</option> <option value="secondvalue">Second Value</option> <option value="thirdvalue">Third Value</option> </select> </body> </html>