Home All Groups Group Topic Archive Search About

How to deselect item on single select listbox?

Author
3 Jan 2006 9:27 PM
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

Author
3 Jan 2006 10:23 PM
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)

Show quoteHide quote
"rpress" wrote:

> 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
>
>
Author
3 Jan 2006 10:46 PM
rpress
Thanks for the input - I was hoping for a way to deselect simply by
clicking on the selected item.

*** Sent via Developersdex http://www.developersdex.com ***
Author
3 Jan 2006 11:10 PM
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."

Show quoteHide quote
"rpress" wrote:

>
>
> Thanks for the input - I was hoping for a way to deselect simply by
> clicking on the selected item.
>
> *** Sent via Developersdex http://www.developersdex.com ***
>
Author
3 Jan 2006 11:20 PM
rpress
Thanks, Phillip - I will give it a try!


*** Sent via Developersdex http://www.developersdex.com ***
Author
9 Jan 2006 6:15 PM
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. ;>)


*** Sent via Developersdex http://www.developersdex.com ***
Author
15 Jan 2009 3:17 AM
jake
Hello,

Just wondering what exactly is prevIndex?

When attempting to use the suggestion below this value does not exist and causes an error.

Thanks
From http://www.google.com.au/search?hl=en&client=firefox-a&rls=org.mozilla:en-GB:official&q=deselect+listbox+previndex&btnG=Search&meta= Posted via DevelopmentNow.com Groups http://www.developmentnow.com/g/