Post
Ask Question

How to Remove Selected Item From ListBox

how to remove selected item of list box after clicking on “ Delete Selected Item “ and Reset all items of listbox after clicking “Reset” button using JavaScript like .


Figure 1 

After clicking on Delete Selected Item


Figure 2

And after clicking on Reset Button


Figure 3

For these add listbox inside body tag and add two button Delete Selected Item and Reset

  1. <asp:ListBox ID="lstbox" runat="server" SelectionMode="Multiple" Height="150px" Width="100px" >  
  2.     <asp:ListItem Value="1" Text ="Class 1"></asp:ListItem>  
  3.     <asp:ListItem Value="2" Text ="Class 2"></asp:ListItem>  
  4.     <asp:ListItem Value="3" Text ="Class 3"></asp:ListItem>  
  5.     <asp:ListItem Value="4" Text ="Class 4"></asp:ListItem>  
  6.     <asp:ListItem Value="5" Text ="Class 5"></asp:ListItem>  
  7.     <asp:ListItem Value="6" Text ="Class 6"></asp:ListItem>  
  8.     <asp:ListItem Value="7" Text ="Class 7"></asp:ListItem>  
  9. </asp:ListBox>  
  10. <button onclick="deleteSelect('lstbox');return false;">Delete Selected Item</button>  
  11. <button onclick="window.location.reload();return false;">Reset</button>  
And javaScript in head Tag
  1. <script>  
  2. function deleteSelect(listid) {  
  3. var listb = document.getElementById(listid);  
  4. var len = listb.options.length;  
  5. for (var i = listb.options.length-1 ; i >= 0 ; i--) {  
  6. if (listb.options[i].selected == true) {  
  7. listb.options.remove(i);  
  8. }  
  9. }  
  10. }  
  11. </script>
And now run the code

It May help to Anyone