Dynamically changing the select box value in html using javascript

You would have seen in many recharge websites,

After entering your mobile number, operator will be chosen automatically. Here you can find how they have implemented that with sample snippet,

[html]
<html>
<head>
<script type="text/javascript">
function Operator(input){
var element = document.getElementById(‘oprCode’);

if(input == 9943){
element.value = "VF";
}else if(input == 9962){
element.value = "AT";
}else if(input == 7200) {
element.value = "TD";
}else if(input == 8124) {
element.value = "ID";
}
}
</script>
</head>
<body>
Enter Your Mobile Number <input type="text" onkeyup="Operator(this.value);">
<br/>
<br/>
Operator is : &nbsp; <select id="oprCode">
<option value="default">——</option>
<option value="ID">Idea</option>
<option value="TD">Tata Docomo</option>
<option value="AT">Airtel</option>
<option value="VF">vodafone</option>
</select>
</body>
</html>
[/html]

Output:

output

op1

Leave a Reply