programming we consider all important topic for knowledge about controls,web Services, JSON, Ajax, database, and interview related Question. In this and sql server tutorial blog we give many examples of jquery as like How Play YouTube Video in Your Website by URL, How to Play YouTube Videos in by using Jquery , Jquery Change div background on mouseover in , JQuery UI Datepicker (Calendar) etc.

Saturday, May 31, 2014

How to Achieve Many Selection in Drop Down List

How to Achieve Many Selection in Drop Down List in Programming :

For Achieve Many Selection in Drop Down List in Programming,Drop Down List control of  is used to give a single select option to the user from many items. You can give specific height and width in pixel by setting its height and width but you will not be able give multiple select option to the Programmer that set it as like check box list. when page load then it is rendered on the page, it is implemented through <select/>  tag. 
Drop Down List control of .Net Programming properties like Back-color,
Fore-color,align  etc. are implemented through style properties of <span>. 
It has less property to decorate in comparison with other controls.
There is no property like Border-style, Border-width. in Drop Down List control of Asp.Net.

But many time the programmer need to select many items in Drop down list for this, here we give some example in ,here some segment of code that is use Jquery in html for achieving this. 

Code  of Asp page:-

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

<html xmlns="">

<title>jQuery Multi Select Dropdown with Checkboxes</title>

<link rel="stylesheet" href="DropDowncss/bootstrap-3.1.1.min.css" type="text/css" />

<link rel="stylesheet" href="DropDowncss/bootstrap-multiselect.css" type="text/css" />
<script type="text/javascript" src=""></script>
<script type="text/javascript" src="js/bootstrap-2.3.2.min.js"></script>
<script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
    <style type="text/css">
            width: 293px;
            height: 73px;
<form id="form1">
<div style="padding:20px">
<select id="chkveg" multiple="multiple" onclick="return chkveg_onclick()">

<option value="sunday">sunday</option>

<option value="monday">monday</option>
<option value="tusday">tusday</option>
<option value="wednessday">wednessday</option>
<option value="thresday">thresday</option>
<option value="friday">friday</option>
<option value="saterday">saterday</option>
</select><br /><br />
<input type="button" id="btnget" value="Get Selected Values" />
<script type="text/javascript">
    $(function () {
            includeSelectAllOption: true
        $('#btnget').click(function () {
    function chkveg_onclick() {



</html> Programming

You can add its option items by directly writing into .aspx page directly 
or dynamically add at run time or bind through database.

for achieving to this goal you want to download two files css file and two .js (JQuery) files.

.css file that you want are :-

1. bootstrap-3.1.1.min.css

2. bootstrap-multiselect.css

And .js files are :-

1. bootstrap-2.3.2.min.js.

2. bootstrap-2.3.2.min.js

Here included some javascript or Jquery on page :-

<script type="text/javascript">
    $(function () {
            includeSelectAllOption: true
        $('#btnget').click(function () {


Example : More Related Post :- 

jQuery Multi Select Dropdown with Checkboxes