In this example, I will tell you how to sort ASP.NET ListBox items with jQuery when button will be clicked. Using Jquery it is easy to sort items on client side.
Here’s an example
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Sorting ASP.NET ListBox using jQuery</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#btnClick").click(function () {
$("#<%=ListBox1.ClientID %>").html($("#<%=ListBox1.ClientID %> option").sort(function (a, b) {
return a.text == b.text ? 0 : a.text < b.text ? -1 : 1
}))
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ListBox ID="ListBox1" runat="server" Rows="8">
<asp:ListItem Value="3">ORANGE</asp:ListItem>
<asp:ListItem Value="2">BANANA</asp:ListItem>
<asp:ListItem Value="4">MANGO</asp:ListItem>
<asp:ListItem Value="1">APPLE</asp:ListItem>
<asp:ListItem Value="5">RAMBUTAN</asp:ListItem>
<asp:ListItem Value="6">ROSELLE</asp:ListItem>
<asp:ListItem Value="7">SAPODILLA</asp:ListItem>
<asp:ListItem Value="8">STARFRUIT</asp:ListItem>
<asp:ListItem Value="9">TAMARIND</asp:ListItem>
</asp:ListBox>
<br />
<input id="btnClick" type="button" value=" Click " />
</div>
</form>
</body>
</html>
Output
Download
Sort-ListBox-jQuery.aspx (1.53 kb)
See live demo