How to make a Template column invisible from Javascript

[Jagat]

Hello all,

     I have a grid in which i have few template columns. I would like to set the 2 grid template columns visibility based on the Internet connection.

Here are the controls in the template column.

  <telerik:GridTemplateColumn HeaderText="Time" UniqueName="Time" Visible = "true">
                                                              <ItemTemplate>

 <telerik:RadMaskedTextBox ID="txtTime" runat="server" PromptChar="_" Width="80px" Mask="<0..2><0..9>:<0..5><0..9>">
                            </telerik:RadMaskedTextBox>
                 </ItemTemplate>
                                <ItemStyle Wrap="False" />
                            </telerik:GridTemplateColumn>
                           
                            <telerik:GridTemplateColumn HeaderText="Odometer" UniqueName="Odometer" Visible = "true">
                                <EditItemTemplate>
                                   <asp:TextBox ID="txtOdometer"  runat="server" ToolTip="Odometer" Text='<%# Eval("Odometer") %>' Width="120px"
                                        onkeydown="return CheckKeyCode()" onfocus="this.value = this.value;" >
                                    </asp:TextBox>
                                    <asp:RegularExpressionValidator Display="Dynamic" ID="regOdometer" runat="server"
                                        ErrorMessage="Only Numbers are allowed." ControlToValidate="txtOdometer" ValidationExpression="\d+\.?\d*" /></EditItemTemplate>
                                <ItemTemplate>
                                 <asp:TextBox ID="txtOdom"  runat="server" ToolTip="Odometer" Text='<%# Eval("Odometer") %>' Width="80px"
                                        onkeydown="return CheckKeyCode()" onfocus="this.value = this.value;" >
                                    </asp:TextBox>
                                </ItemTemplate>
                                <ItemStyle Wrap="False" />
                            </telerik:GridTemplateColumn>

1) I have to set those columns visibilty based on the internet check.. How do i do this?

I am trying something like this..

function hideColumn()
{
    var grid = $find("<%=RadGrid1.ClientID %>");
    var MasterTable = grid.get_masterTableView();
     var rows = MasterTable.get_dataItems();
    var cell = MasterTable.getCellByColumnUniqueName(rows, "Time");
for(i=0;i <rows.length-1;i++)
{
 rows[i].cells[cell].style.display="none";
}
}

2) How do i access a column?
3) Where should i call this hidefunction in the below script.

$(document).ready(function() {
        $("form").submit(function(e) {
            var r = $.ajax({ "url": 'http://www.xxxxxxxxx.com/xxxxx', "async":false }).responseText;
           
            if( r==null ) e.preventDefault();
        })
    })

  if r is async then  i am removing the postback. and  probably at that time i have to call the hidefunction.
How do i do this?
 

Appreciate the help

Thanks

[Iana Tsolova]

Hi Jagat,

The best way to hide a columnin RadGrid is by using the hideColumn() client-side method.

You can also try using the HeaderContextMenu for that purpose. See the below demos:
http://demos.telerik.com/aspnet-ajax/grid/examples/generalfeatures/headercontextmenu/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/grid/examples/programming/savinggridsettingsonperuserbasis/defaultcs.aspx

Best wishes,
Iana Tsolova
the Telerik team