chech/uncheck all checkboxes in ListView with onItemDataBound

Question

I have a ListView with pdf thumbnail images created OnItemDataBound. Every thumbnail has a checkbox to select the pages I want to upload. Everything works fine - so far. Now I made another checkbox to select ALL pages an the problem is: If I check the checkbox all preview thumbnails in my ListView disappears

This is my ListView:

<asp:ListView ID="pdfPagesListView" runat="server" OnItemDataBound="pdfPagesListView_ItemDataBound">  
    <ItemTemplate>
        <div id="pdfFrameDiv" runat="server" class="pdfPage"><%# Container.DataItem %> 
            <div style="position:absolute;">
                <asp:Image ID="pdfPreviewImage" runat="server" /> 
            </div>                             
            <div style="position:relative;height:188px;background-color:rgb(240,240,240)">  
                <asp:Panel ID="thumbnails" runat="server" /> 
            </div>                                              
            <div style="position:relative; top:-14px; left:120px;">
                <asp:CheckBox ID="selectPdfPageCheckbox" runat="server" />
            </div>
        </div>
    </ItemTemplate>
</asp:ListView>

This is my CheckBox

<asp:checkbox ID="selectAllPages" runat="server" AutoPostBack="true" OnCheckedChanged="selectAllPdfPages" />

This is the OnItemDataBound code of the ListView:

protected void pdfPagesListView_ItemDataBound(object sender, ListViewItemEventArgs e)
{
    if (e.Item.ItemType == ListViewItemType.DataItem)
    {
        if (byteArray.Length < 25000000)
        {
            ListViewDataItem dataItem = (ListViewDataItem)e.Item;
            int i = dataItem.DisplayIndex;

            if (Session["computedPages"] != null)
            {
                int[] computedPages = (int[])Session["computedPages"];
                if (computedPages[i] == 1)
                {
                    dataItem.Visible = false;
                }
            }                

            try
            {
                Panel thumbnailPanel = (Panel)e.Item.FindControl("thumbnails");
                Thumbnail thumbnail = new Thumbnail();
                thumbnail.SessionKey = unique;
                thumbnail.Index = i + 1;
                thumbnail.DPI = 17;
                thumbnail.Width = 200;
                thumbnailPanel.Controls.Add(thumbnail);

                Image pdfPreviewImage = (Image)e.Item.FindControl("pdfPreviewImage");
                pdfPreviewImage.Visible = false;
            }
            catch (Exception ex)
            {
                Image pdfPreviewImage = (Image)e.Item.FindControl("pdfPreviewImage");
                pdfPreviewImage.ImageUrl = "~/img/pdfPreview.jpg";
            }

        }

        else
        {
            Image pdfPreviewImage = (Image)e.Item.FindControl("pdfPreviewImage");
            pdfPreviewImage.ImageUrl = "~/img/pdfPreview.jpg";
        }
    }
}

This is the code of my check/uncheck the checkbox event:

protected void selectAllPdfPages(object sender, EventArgs e)
{
    if (selectAllPages.Checked == true)
    {
        foreach (ListViewDataItem item in pdfPagesListView.Items)
        {
            CheckBox cb = (CheckBox)(item.FindControl("selectPdfPageCheckbox"));
            cb.Checked = true;
        }
    }

    else
    {
        foreach (ListViewDataItem item in pdfPagesListView.Items)
        {
            CheckBox cb = (CheckBox)(item.FindControl("selectPdfPageCheckbox"));
            cb.Checked = false;
        }

    }

}

This is how my page looks like after the OnItemDataBound Event:

An this how it looks after checking the selectAllPages checkbox:

I want to check/uncheck all checkboxes without losing all the thumbnail previews. I hope anyone can help me out...

Thanks in advance

Answer 1

Why don't you want to make it on client side using jQuery? This will allow you to check/unchek your checkboxes without sending your webform to server on every click and this means that you will not loose any thumbnails, as you said.