How to deselect item on single select listbox?


R

rpress

In a multi-select listbox one may deselect items, but this does not
work in a single select listbox. Has anyone come across a way to do
this? (deselect so that no items are selected)

Thanks
 
Ad

Advertisements

P

Phillip Williams

1- Add a HtMLinputButton in the markup
<input type="button" onclick="ClearList();" value="Clear Selections">

and add a corresponding javascript:

<script language="javascript">
function ClearList()
{
var list = document.getElementById("ListBox1");
if (list) list.selectedIndex =-1;
}
</script>

2- Add a Button server control:
<asp:Button ID="btnDeselect" Runat="server" Text="De-Select"></asp:Button>

and in the codebehind:

Private Sub btnDeselect_Click(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles btnDeselect.Click
ListBox1.ClearSelection()
End Sub

3- You can insert a list item with a blank value for the user to click if
you wish them to deselect a previously selected item, e.g.

Dim li As New ListItem("No Selection", "")
listbox1.Items.Insert(0, li)
 
R

rpress

Thanks for the input - I was hoping for a way to deselect simply by
clicking on the selected item.
 
P

Phillip Williams

Unfortunately the default behavior of the ListBox does not allow for
deselecting a selected item by clicking on it. You can try handling the
onclick event to the ListBox (client-side):

<asp:ListBox ID="ListBox1" Runat="server" onclick="toggle();">
<%-- here are the list items --%>
</asp:ListBox>

and in the Javascript

function toggle()
{
var list = window.event.srcElement;
if (list)
{
if (list.selectedIndex == prevIndex) list.selectedIndex=-1;
prevIndex = list.selectedIndex;
}
}

This should produce the effect that you were hoping for; namely "to deselect
simply by clicking on the selected item."
 
Ad

Advertisements

R

rpress

Thanks again - I decided to use the following code on the mousedown
event to give the effect that a right mouse click clears the listbox.

function toggle()// toggle clears single select listbox on mouse down
{
var list = window.event.srcElement;
list.selectedIndex=-1;
}

works for me. ;>)
 
Ad

Advertisements


Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top