<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
type: "POST",
contentType: "application/json",
data: "{}",
url: "how to append dropdownlist using jquery ajex.aspx/getSelectList",
dataType: "json",
success: function(data) {
var select = $("#example");
select.children().remove();
if (data.d) {
$(data.d).each(function(index, item) {
select.append($("<option>").val(item.Value).text(item.Text));
});
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
debugger;
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<select id="example" name="example" multiple="multiple">
</select>
</form>
</body>
</html></html>
[WebMethod]
public static object getSelectList()
{
var objList = (new[] { new { Text = "Option 1", Value = 1 } }).ToList();
objList.Add(new { Text = "Option 2", Value = 2 });
objList.Add(new { Text = "Option 3", Value = 3 });
objList.Add(new { Text = "Option 4", Value = 4 });
objList.Add(new { Text = "Option 5", Value = 5 });
objList.Add(new { Text = "Option 6", Value = 6 });
objList.Add(new { Text = "Option 7", Value = 7 });
return objList;
}