This is a migrated thread and some comments may be shown as answers.
(De)Select all items in ListView using templates
5 Answers 87 Views
This is a migrated thread and some comments may be shown as answers.
Datamex
Top achievements
Rank 2
Datamex asked on 23 Mar 2011, 09:31 AM
I must say I haven't seen anything like this on the forums, but possibly I overlooked a thread or demo. However, I am using a ListView with the following templates: LayoutTemplate, InsertItemTemplate, ItemTemplate, SelectedItemTemplate and EditItemTemplate. An item consists of a LinkButton. See example below:

<asp:LinkButton ID="ItemLinkButton" runat="server" CommandName="Select">
    <%# Eval("Value1") %><br />
    <%# Eval("Value2") %><br />
    <%# Eval("Value3") %><br />
    <%# Eval("Value4") %>
</asp:LinkButton>

where "Value#" is just a string from a certain datasource. As you can see this LinkButton has its CommandName property set to "Select". When you select a single item, the selected item will appear using the SelectItemTemplate (that is with inversed colors as the normal ItemTemplate). But, I have a problem with (de)selecting all items.

This ListView currently contains 2 items. The LayoutTemplate holds a button to select or deselect all items in the ListView. This button is linked through the ItemCommand event ("onitemcommand") with its CommandName property set to "DeSelectAll". In my code-behind I do:

protected void RadListView_ItemCommand(object sender, RadListViewCommandEventArgs e)
{
    if (e.CommandName == "DeSelectAll")
    {
        RadListView rlv = sender as RadListView;
        if (rlv.SelectedItems.Count == rlv.Items.Count)
        {
            foreach (RadListViewDataItem item in rlv.SelectedItems)
            {
                item.Selected = false;
            }
        }
        else
        {
            foreach (RadListViewDataItem item in rlv.Items)
            {
                item.Selected = true;
            }
        }
    }
}

As I said the ListView currently contains 2 items. So whenever the button - to select or deselect all items - is clicked this event is fired. So when you are debugging it looks like it's working, but visually it's far from what you actually want.

Firstly (situation 1), if no item has been preselected (both items are not selected) and you click the button visually nothing happens, while under water (code) the item.Selected properties are changed accordingly. When you click the button for the second time both items change to the SelectedItemTemplate, while under water the item.Selected properties are set back to "false". Notice, you have to click twice in order to get this result.

Secondly (situation 2), if one of two items has been preselected (this works as mentioned earlier) (1) and you click the button visually nothing happens, while under water the item.Selected properties are changed accordingly (both items have their Selected property set to "true") (2). Notice that you can't see any difference visually (the preselected item still is the only visible selected item). Next, click the item - which visually still is the only selected item - and be amazed this item deselects and the other gets selected (3). To make one another clear, let's schematize this:

  1. item 1: selected, item 2: not selected, visibility: item 1 uses SelectedItemTemplate, item 2 uses ItemTemplate
  2. item 1: selected, item 2: selected, visibility: item 1 uses SelectedItemTemplate, item 2 uses ItemTemplate
  3. item 1: not selected, item 2: selected, visibility: item 1 uses ItemTemplate, item 2 uses SelectedItemTemplate

As you can see, step 2 is the problem. The property "Selected" for both items is set to "true", but visually item 2 is not using the correct template. Instead of using ItemTemplate it should be using SelectedItemTemplate. Notice that in both situations you have to click twice to visually get a result.

Any thoughts or suggestions on how to select or deselect all items in a ListView?

Thanks in advance.

Regards,
Datamex

5 Answers, 1 is accepted

Sort by
0
Vasil
Telerik team
answered on 28 Mar 2011, 09:48 AM
Hi Datamex,

You should rebind the RadListView after deselecting the elements. I tried this code and it deselects all elements properly:

ASPX:
<telerik:RadListView ID="RadListView1" runat="server" OnNeedDataSource="RadListView1_NeedDataSource"
      AllowMultiItemSelection="true" OnItemCommand="RadListView1_ItemCommand">
      <ItemTemplate>
        <asp:LinkButton ID="ItemLinkButton" runat="server" CommandName="Select">
     Select this item
        </asp:LinkButton>
        <br />
      </ItemTemplate>
      <SelectedItemTemplate>
        <asp:LinkButton ID="ItemLinkButton" runat="server" CommandName="DeSelect">
     Deselect this item
        </asp:LinkButton>
        <asp:LinkButton ID="LinkButton1" runat="server" CommandName="DeSelectAll">
     Deselect all items
        </asp:LinkButton>
        <br />
      </SelectedItemTemplate>
    </telerik:RadListView>

C#:
protected void RadListView1_NeedDataSource(object sender, Telerik.Web.UI.RadListViewNeedDataSourceEventArgs e)
{
    (sender as RadListView).DataSource = new int[] { 1, 2, 3, 4 };
}
protected void RadListView1_ItemCommand(object sender, RadListViewCommandEventArgs e)
{
    if (e.CommandName == "DeSelectAll")
    {
        RadListView radListView = sender as RadListView;
 
        foreach (RadListViewDataItem item in radListView.SelectedItems)
        {
            item.Selected = false;
        }
        RadListView1.Rebind();
    }
}

All the best,
Vasil
the Telerik team
0
Datamex
Top achievements
Rank 2
answered on 28 Mar 2011, 10:16 AM
Hi Vasil,

Thanks for the reply! I think I missed the "Rebind" method. I use the "Class Members" page of a certain Telerik ASP.NET control (for example RadListView: http://www.telerik.com/help/aspnet-ajax/telerik.web.ui-telerik.web.ui.radlistview_members.html) most of the time when I'm developing, but the description of the "Rebind" method is empty. It would be useful for developers to appropriate describe any property and method of a control. Nevertheless, I just added < RadListView >.Rebind() and it works smooth now! Thanks for the supportive response.

Regards,
Datamex
0
Vasil
Telerik team
answered on 28 Mar 2011, 02:57 PM
Hi Datamex,

Thank you for your feedback. We will review the summaries of the public methods and fields and update them in the near future.

Kind regards,
Vasil
the Telerik team
0
Vasssek
Top achievements
Rank 1
answered on 25 Aug 2018, 12:47 PM

Hi,

I would like to ask why for deselect all items this method works:

foreach (RadListViewDataItem item in radListView.SelectedItems)
        {
            item.Selected = false;
        }

 

and this isn't work:

RadListView1.SelectedItems.Clear();

 

Is it bug or I do something wrong ?

Best regards

Vasssek

0
Marin Bratanov
Telerik team
answered on 27 Aug 2018, 05:14 PM
Hi Vasssek,

The .Clear() method merely clears a collection, while the Selected property can execute logic. 

You would get similar behavior if you have a List<someObject> and .Clear() it, or, if you change a property or call a method on each object in the list.


Regards,
Marin Bratanov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Asked by
Datamex
Top achievements
Rank 2
Answers by
Vasil
Telerik team
Datamex
Top achievements
Rank 2
Vasssek
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or