user763554
user763554

Reputation: 2041

How to force refresh of GridView?

The type of refresh I want doesn't deal with data per se.

Here's the scenario: I have a gridview with 3 columns A, B and C. The user can click on checkboxes a, b and c to make the corresponding columns visible or not. [To be clear, these checkboxes are external to the gridview.]

Now I want the gridview to be refreshed immediately showing only the selected columns after each check box is clicked. How do I do so?

Upvotes: 1

Views: 650

Answers (1)

Icarus
Icarus

Reputation: 63956

Assuming you have a checkbox for every column in the table (Grid) you can write something like this in jQuery:

$(function() {
    $('input:checkbox').change(function() {
        //get a reference to the corresponding table column
        var $col = $('<#%=grid.ClientID %>' + ' td:nth-child(' + $(this).val() + ')');
        if (this.checked) $col.hide();
        else $col.show();
    });
});​

And the corresponding check boxes have a value set to the column indexes in the table. For example:

<input type="checkbox" value="1" /><-- hides first column in grid-->
<input type="checkbox" value="2" /><-- hides second column in grid-->
<input type="checkbox" value="3" /><-- hides third column in grid-->

A shorter/simpler version that may also work for you is this:

$(function() {
    $('input:checkbox').change(function() {
        var $col = $('table ' + 'td:nth-child(' + $(this).val() + ')');
        $col.toggle();
    });
});​

jsfiddle.

Update - C# version

protected void Check_Clicked(Object sender, EventArgs e) 
  {
     CheckBox theOneClicked= (sender as CheckBox);
     if(theOneClicked.ID=="checkbox1")
         myGrid.Columns[0].Visible=false;
     else if(theOneClicked.ID=="checkbox2")
         myGrid.Columns[1].Visible=false;
     else if(theOneClicked.ID=="checkbox3")
         myGrid.Columns[2].Visible=false;
  }

Upvotes: 1

Related Questions