title: Control gridview column visibility using javascript
body: <p>I have a gridview and I have to control the visiblitiy of the grid columns using javascript. Consider this gridview. I have a few columns. </p>
  
  <pre><code>&lt;asp:GridView ID="grdTest" runat="server" AutoGenerateColumns="False" Width="100%"&gt;
      &lt;Columns&gt;
          &lt;asp:TemplateField&gt;
              &lt;ItemTemplate&gt;
                  &lt;asp:CheckBox ID="chkResource" runat="server" /&gt;
              &lt;/ItemTemplate&gt;
          &lt;/asp:TemplateField&gt;
          &lt;asp:TemplateField HeaderText="Resource"&gt;
              &lt;ItemTemplate&gt;
                 &lt;asp:Label ID="Resource" Text='&lt;%# Bind("Resource") %&gt;' runat="server" /&gt;
              &lt;/ItemTemplate&gt;
          &lt;/asp:TemplateField&gt;
                 &lt;asp:BoundField DataField="Description" HeaderText="Resource Description" HtmlEncode="false"&gt;
          &lt;ItemStyle HorizontalAlign="Center" /&gt;
          &lt;HeaderStyle HorizontalAlign="Center" /&gt;
      &lt;/asp:BoundField&gt;
  
       &lt;/asp:TemplateField&gt;
    &lt;/Columns&gt;
  &lt;/asp:GridView&gt;
  </code></pre>
  
  <p>I can control the visibility of these columns at the server side by using this - </p>
  
  <pre><code>grdTest.Columns[n].Visible = false;
  </code></pre>
  
  <p>But, I have to control the visibility from the client side using javascript. I tried a lot but I was only able to access either the row object or any particular cell of the gridview. </p>
  
  <pre><code>grid.rows[index].cells[i].style="display: none"; //for cell
  </code></pre>
  
  <p>Is there a way to access the column object of the gridview and control its visibility using javascript?</p>