Categories
JavaScript

JavaScript global variable updated by onchange event of drop down lists

Example of Global variable in JavaScript. In this program when you select a drop down element then JavaScript function is called and the select element is passed to the function and function updates the global variable inside the function and add the select element’s option element’s value to the global variable and the output is displayed.

A program by Mr. Bikram Choudhury, Personally teach web designing,JavaScript,jQuery in 
Kolkata. Phone (India +91)9163111390

Usage of JavaScript Global Variable to hold date of birth value from Drop Down Lists

<script type="text/javascript">
var dob=''; // Global variable
function set2DOB(selectTag)
{
 dd = selectTag.options[selectTag.selectedIndex].value;
 /* Function updates global variable */
 dob = dob+dd+'/'; 
 alert(dob);
}
</script>

HTML Code :

<select name="date" id="date" onchange="set2DOB(this)" size="1">
 <option value="">Date</option>
 <option value="01">01</option>
 <option value="02">02</option>
 <option value="03">03</option>
 <option value="04">04</option>
 <option value="05">05</option>
 <option value="06">06</option>
 <option value="07">07</option>
 <option value="08">08</option>
 <option value="09">09</option>
 <option value="10">10</option>
 <option value="11">11</option>
 <option value="12">12</option>
 <option value="13">13</option>
 <option value="14">14</option>
 <option value="15">15</option>
 <option value="16">16</option>
 <option value="17">17</option>
 <option value="18">18</option>
 <option value="19">19</option>
 <option value="20">20</option>
 <option value="21">21</option>
 <option value="22">22</option>
 <option value="23">23</option>
 <option value="24">24</option>
 <option value="25">25</option>
 <option value="26">26</option>
 <option value="27">27</option>
 <option value="28">28</option>
 <option value="29">29</option>
 <option value="30">30</option>
 <option value="31">31</option>
 </select>
<select name="mon" id="mon" onChange="set2DOB(this)" size="1">
 <option value="">Month</option>
 <option value="01">January</option>
 <option value="02">February</option>
 <option value="03">March</option>
 <option value="04">April</option>
 <option value="05">May</option>
 <option value="06">June</option>
 <option value="07">July</option>
 <option value="08">August</option>
 <option value="09">September</option>
 <option value="10">October</option>
 <option value="11">November</option>
 <option value="12">December</option>
 </select>