Skip to content Skip to sidebar Skip to footer

bind dropdownlist using jquery

Bind dropdownlist using jquery:-
       In many situation we need to bind the drop down dynamically, example: from database or other. So we can use jquery to bind the dropdowns using a for loop. The example is shown below.

Syntax:-

$("#ddlID").append($("<option></option>").val(i).html(j));



Example:-

<html>
<head>
<title>Move The Div Position</title>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

<script type="text/JavaScript">
function bind_ddl()
{
 $("#ddl_ID").empty();
 for(var i=1;i<=100;i++)
 {
$("#ddl_ID").append($("<option></option>").val(i).html(i));
 }
 $("#ddl_ID").css("border", "2px solid red");
}

function ddl_click()
{
var ddl_length=$('#ddl_ID').children('option').length;
if(ddl_length==0)
{
alert("Click Bind DropDown");
}
}
</script>
</head>

<body>
Numbers :
<select id="ddl_ID" onclick="ddl_click();">
</select>
<input value="Bind DropDown" type="button" onclick="bind_ddl();">
</body>
</html>
   

Output:-
 

Numbers :


Advertisement

Screenshots:-

Post a Comment for "bind dropdownlist using jquery"