Datagrid Column Hiding and Datagrid Resizing

[henslecd]

Here is some code that would be useful for reports where your user would like to choose the columns of the datagrid that he or she wants to see.

I use a checkboxlist with a checkbox for each column of my datagrid. To make it easy for the user I suggest setting the value of the ListItems to the headertext of your datagrid columns. There is also a button at the end that triggers the event.

CheckBoxList

Select data you would like to view
<asp:checkboxlist id="check1" runat="server" RepeatDirection="Horizontal" Width="114px">

<asp:ListItem Value="VENDOR" Selected="True">VENDOR
</asp:ListItem>
<asp:ListItem Value="PHONE" Selected="True">PHONE
</asp:ListItem>
<asp:ListItem Value="EMAIL" Selected="True">EMAIL
</asp:ListItem>
<asp:ListItem Value="ADDRESS" Selected="True">ADDRESS
</asp:ListItem>
<asp:ListItem Value="WEBSITE" Selected="True">WEBSITE
</asp:ListItem>
</asp:checkboxlist>

<asp:button id="Button3" runat="server" Width="108px" Text="Select Data"></asp:button>

The next part is the datagrid.

Note: I didn't include all the datagrid attributes for clarity.

Datagrid

<asp:datagrid id=DataGrid1 runat="server" Width="500px" Height="232px">
<Columns>
<asp:BoundColumn DataField="VENDOR" HeaderText="VENDOR"></asp:BoundColumn>
<asp:BoundColumn DataField="PHONE"  HeaderText="PHONE"></asp:BoundColumn>
<asp:BoundColumn DataField="EMAIL"  HeaderText="EMAIL"></asp:BoundColumn>
<asp:BoundColumn DataField="ADDRESS"
HeaderText="ADDRESS"></asp:BoundColumn>
<asp:BoundColumn DataField="WEBSITE" HeaderText="WEBSITE"></asp:BoundColumn>
</Columns>

Finally I have the button's click event behind the page. The commented out lines of code will let you set specific column size. If you do not uncomment these lines of code, the columns will shrink to whatever the longest value's length in the column is. Setting the column width makes reports look a lot cleaner, but if you are pressed for space then just leave those lines commented.

Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click

        Dim i As Integer

        'Dim columns As Integer = check1.Items.Count
        'Dim columnwidth As Integer = 100
        'Dim mincolumns As Integer = 0
        Dim maxcolumns As Integer = check1.Items.Count

        For i = 0 To maxcolumns - 1

            DataGrid1.Columns(i).ItemStyle.Wrap = False

'DataGrid1.Columns(i).HeaderStyle.Width = Unit.Pixel(columnwidth)

            If Not check1.Items(i).Selected Then

                'If columns > mincolumns Then

                'columns -= 1

                'End If

            DataGrid1.Columns(i).Visible = False

            Else

                'If columns > maxcolumns Then

                'columns += 1

                'End If

            DataGrid1.Columns(i).Visible = True

            End If

        Next

    End Sub

I welcome any suggestions to improving it. Let me know if you have questions.

Chad

 

[henslecd]

Correction for post. I left in some unneeded code.

The code behind the page should be:

Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click

Dim i As Integer

'Dim columnwidth As Integer = 100

Dim maxcolumns As Integer = check1.Items.Count

For i = 0 To maxcolumns - 1

DataGrid1.Columns(i).ItemStyle.Wrap = False

'DataGrid1.Columns(i).HeaderStyle.Width = Unit.Pixel(columnwidth)

If Not check1.Items(i).Selected Then

DataGrid1.Columns(i).Visible = False

Else

DataGrid1.Columns(i).Visible = True

End If

Next

End Sub

 

[dragonwell]

That's cool! The only suggestion I have would be to make the CheckBoxList dynamically populated with the an array of the names of the columns in the DataGrid.

maybe...

For i = 0 To DataGrid1.Columns.Count-1

   check1.Items.Add(new ListItem(DataGrid1.Columns(i).HeaderText))


Next

 

[henslecd]

Hey that is an awesome idea. I will add that to the FAQ I wrote if you don't mind?

Thanks!

 

[henslecd]

Here is dragonwell's suggestion modified to work for the post I wrote.

In the page load event...

Dim i As Integer

If Not IsPostBack Then

    For i = 0 To DataGrid1.Columns.Count - 1

     If Not DataGrid1.Columns(i).HeaderText = "" Then

     check1.Items.Add(New ListItem(DataGrid1.Columns(i).HeaderText))

      End If
     
     Next

End If