Top Ad unit 728 × 90

How To Set A Dropdown Box Value In JQuery

A simple select / drop down box, with a id=”country”.

<select id="country">
   <option value="None">-- Select --</option>
   <option value="India">India</option>
   <option value="Sree Lanka">Sree Lanka</option>
   <option value="Bangladesh">Bangladesh</option>
</select>


1. To display the selected drop down box value.

$('#country').val();
2. To set a drop down box value to ‘India’.

$("#country").val("India");
3. To set a drop down box value to ‘Sree Lanka’.

$("#country").val("Sree Lanka");
4. To set a drop down box value to ‘Bangladesh’.

$("#country").val("Bangladesh");
5. To disable the ‘Sree Lanka’ option in drop down box.

$("#country option[value='Sree Lanka']").attr("disabled", true);
6. To enable the ‘Sree Lanka’ option in drop down box.

$("#country option[value='Sree Lanka']").attr("disabled", false);
jQuery select / drop down box example
<html>
<head>
<title>jQuery select / dropdown box example</title>

<script type="text/javascript" src="jquery-1.8.3.min.js"></script>

</head>

<body>

<h1>jQuery select / dropdown box example</h1>

<script type="text/javascript">

  $(document).ready(function(){

    $("#isSelect").click(function () {

    alert($('#country').val());

    });

    $("#selectIndia").click(function () {

    $("#country").val("India");

    });

    $("#selectSL").click(function () {

    $("#country").val("Sree Lanka");

    });

    $("#selectBangladesh").click(function () {

    $("#country").val("Bangladesh");

    });

    $("#disableSL").click(function () {

    $("#country option[value='Sree Lanka']").attr("disabled", true);

    });

    $("#enableSL").click(function () {

    $("#country option[value='Sree Lanka']").attr("disabled", false);

    });

  });
</script>
</head><body>

<select id="country">
<option value="None">-- Select --</option>
<option value="India">India</option>
<option value="Sree Lanka">Sree Lanka</option>
<option value="Bangladesh">Bangladesh</option>
</select>

<br/>
<br/>
<br/>

<input type='button' value='Display Selected' id='isSelect'>
<input type='button' value='Select India' id='selectIndia'>
<input type='button' value='Select SL' id='selectSL'>
<input type='button' value='Select Bangladesh' id='selectBangladesh'>
<input type='button' value='Disable SL' id='disableSL'>
<input type='button' value='Enable SL' id='enableSL'>
</body>
</html>
How To Set A Dropdown Box Value In JQuery Reviewed by Ashok Sen on 14:08:00 Rating: 5

No comments:

Website Design Company at Kolkata All Rights Reserved © 2014 - 2019
Developed by Asenwebmedia

Contact Form

Name

Email *

Message *

Powered by Blogger.