JavaScript Select Option - javatpoint

JavaScript Select Option - javatpoint

We will understand how to manage <select> option in JavaScript in this tutorial.

A option facilitate us the options list. It permits us to choose a single or more than one option. We use the and elements for forming a option.For example:The option permits us to choose one option at a time which is mentioned above.

If we wish more than one selections, we can include attribute to <multiple> elements below:We use the HTMLSelectElement type for interacting with option in JavaScript.

The HTMLSelectElement type contains the following helpful attributes:

We apply the DOM API like querySelector() or getElementById().

The example indicates how to obtain the selected option index which is mentioned below:

How it works:

The element's value property relies on the component and multiple attribute of its HTML:Consider the below example:In this above example:The HTMLOptionElement type illustrates the element in JavaScript.This type contains the following properties:Index- The option's index within the group of options.Selected- It returns a true value if the option is chosen. We set the selected property true for selecting an option.Text- It returns the text of the option.Value- It returns the value attribute of HTML.The component contains an option attribute that permits us for accessing the collection options:

For example, for accessing the value and text of the second option, we use the below:

For getting a selected option of the component along with an individual selection, we use the below code:After that, we can access the value and text of a selected option by value and text properties:When the component permits more than one selections, we can use a selected attribute for determining which option is selected:

In the example, the sb.option is the array-like object. Hence, it does not contain the filter() method same as the Array object.

For borrowing these types of methods through an array object, we use a call() method, the below gives the array of chosen options:

And for getting the text attribute of any option, we can chain the outcome of a filter() method along with a map() method like below:

WE can use the for loop for iterating by the selected list options for determining which is chosen. A function could be described for returning the reference to a selected option or the value. The below gives the reference to a selected option:

This function gives a single chosen option, which is compatible for the select-one type of select list. The same function compatible for select-multiple type pf select lists could give more than one selected option.

SoapUI

RPA

Manual T.

Cucumber

Appium

PostgreSQL

Solr

MongoDB

Gimp

Verilog

Teradata

PhoneGap

Aptitude

Reasoning

Verbal A.

Interview

Company

AI

AWS

Selenium

Cloud

Hadoop

ReactJS

D. Science

Angular 7

Blockchain

Git

ML

DevOps

DBMS

DS

DAA

OS

C. Network

Compiler D.

COA

D. Math.

E. Hacking

C. Graphics

Software E.

Web Tech.

Cyber Sec.

Automata

C

C++

Java

.Net

Python

Programs

Control S.

Data Mining

Hindi100

Lyricsia

Website Development

Android Development

Website Designing

Digital Marketing

Summer Training

Industrial Training

College Campus Training

Address: G-13, 2nd Floor, Sec-3

Noida, UP, 201301, India

Contact No: 0120-4256464, 9990449935

© Copyright 2011-2018 www.javatpoint.com. All rights reserved. Developed by JavaTpoint.