html select onchange code example

Example 1: html select placeholder

Placeholder attribute does not exist for the <select> tag.
But there are some ways to make a placeholder for the select box.
The easiest way of making a placeholder for the <select> element is using the disabled and selected attributes with the HTML5 hidden global attribute.
  
<select name="monthname" required>
  <option value="" selected disabled hidden>Select Month</option>
  <option value="Jan">January</option>
  <option value="Feb">February</option>
  <option value="Mar">March</option>
  <option value="Apr">April</option>
  <option value="May">May</option>
  <option value="Jun">June</option>
  <option value="Jul">July</option>
  <option value="Aug">August</option>
  <option value="Sep">September</option>
  <option value="Oct">October</option>
  <option value="Nov">November</option>
  <option value="Dec">December</option>
</select>

Example 2: select form submit onchange

<select onchange="this.form.submit()">
    ...
</select>

Example 3: onchange on select tag

<select id="comboA" onchange="getComboA(this)">
  <option value="">Select combo</option>
  <option value="Value1">Text1</option>
  <option value="Value2">Text2</option>
  <option value="Value3">Text3</option>
</select>

Example 4: js select on change value

document.getElementById('my-select').addEventListener('change', function() {
  console.log('You selected: ', this.value);
});

Example 5: js html textbox on change

<!-- 
	You can use any of the following:
	onkeydown, onkeyup or onchange
 -->

<input type="text" onkeydown="keydownFunction()" 
onkeyup="keyupFunction()" onchange="changeFunction()">

Example 6: javascript input onchange get value

var element = document.getElementById("myInput");
element.onchange = function() {
  console.log(element.value);
}