JavaScript onChange event

Created by
Thursday, September 15, 2016

The javascript onchange event is a common JS event used for element changes on a page. Onchange for example can be used for triggering an event when a user changes a selection on a dropdown list.

 

The event object is accessible to all event handlers in most common browsers today.

 

Let’s take a look at a basic example.

<head>
    <script type="text/javascript">
        function GetSelectedValue (val) {
            var selected = val.options[val.selectedIndex];
            alert ("Selected: " + selected.value);
        }
    </script>
</head>
<body>
    Select: <br />
    <select onchange="GetSelectedValue (this)">
        <option value="1" />One
        <option value="2" />Two
        <option value="3" />Three
    </select>
</body>

Here is an example called in MVC

@Html.DropDownList("Selection", (IEnumerable<SelectListItem>) ViewBag.MyItems, "-- Select --", new {@id = "MyItem", @onchange= "SetItem()" })

 

The onchange event is supported by the following HTML elements:

  • Input:checkbox
  • Input:file
  • Input:password
  • Input:radio
  • Input:search
  • Input:text
  • Keygen
  • Select
  • textarea
0
Rating
1 2 3 4 5

Save

Saved

Report

Reported
Reasons
Cancel
0 comments