Tech Study

How to Get selected Text and Value of DropDownList on OnChange event using JavaScript

Introduction

In this article, I will explain with the help of an example to get selected Text and Value of DropDownList on OnChange event using JavaScript.

When an item is selected in the HTML Select DropDownList, the GetSelectedTextValue JavaScript function is executed to which the reference of the HTML Select DropDownList is passed as parameter. Using this reference, the selected Value & Text is determined and is displayed using a JavaScript alert box.

<html>
<head>
    <title></title>
 
</head>
<body>
    Select Car:
    <select id="ddlCars" onchange="GetSelectedTextValue(this)">
        <option value=""></option>
        <option value="1">Nissan</option>
        <option value="2">Toyota</option>
        <option value="3">Honda</option>
        <option value="4">Audi</option>
        <option value="5">Mercedes</option>
    </select>
    <script type="text/javascript">
        function GetSelectedTextValue(ddlCars) {
            var selectedText = ddlCars.options[ddlCars.selectedIndex].innerHTML;
            var selectedValue = ddlCars.value;
            alert("Selected Text: " + selectedText + " Value: " + selectedValue);
        }
    </script>
</body>
</html>
How to Get selected Text and Value of DropDownList on OnChange event using JavaScript
How to Get selected Text and Value of DropDownList on OnChange event using JavaScript

TaggedHow to Get selected Text and Value of DropDownList on OnChange event using JavaScript

Java Final keyword

Introduction : java final keyword The final keyword present in Java programming language is generally used for restricting the user. …

Read more

C++ Memory Management: new and delete

C++ Memory Management We know that arrays store contiguous and the same type of memory blocks, so memory is allocated …

Read more