CODEWITHSUNDEEP
javascriptc#asp.netgridview
user5320422
user5320422

Reputation:

unable to hide label and gridview from java script in asp.net

I would like to hide label and grid view in javascript.
I had succeed to hide images and checkboxes but not yet label and grid view.
How to do it using javascript?

javascript

<script type="text/javascript">
        function txtOnKeyPress(txt1)
         {
            if (txt1 != 'undefined') 
            {
             document.getElementById("GVPaymentDetails").style.display='none';
             document.getElementById('LblValidReg').style.display='none';

            }
         }
    </script>

aspx code

 <asp:TextBox ID="txtRegno" runat="server"  AutoPostBack="false"
            MaxLength="10"  onkeydown="txtOnKeyPress(this);"></asp:TextBox>



 <asp:GridView ID="GVPaymentDetails" runat="server" AutoGenerateColumns="False" 
            BackColor="White" BorderColor="#336666" BorderStyle="Double" BorderWidth="3px" 
            CellPadding="4" GridLines="Horizontal" EmptyDataText="No Records Found">
            <RowStyle BackColor="White" ForeColor="#333333" />
            <Columns>
                <asp:BoundField HeaderText="Enquiry id" DataField="EnquiryId" />
                <asp:BoundField HeaderText="Reg Number" DataField="RegistrationNumber" />
                <asp:BoundField HeaderText="Name" DataField="Name" />
            </Columns>
            <FooterStyle BackColor="White" ForeColor="#333333" />
            <PagerStyle BackColor="#336666" ForeColor="White" HorizontalAlign="Center" />
            <SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#336666" Font-Bold="True" ForeColor="White" />
        </asp:GridView>

 <asp:Label ID="LblValidReg" runat="server"></asp:Label>

Upvotes: 0

Views: 619

Answers (3)

Ghanshyam Lakhani
Ghanshyam Lakhani

Reputation: 372

use

$("#<%=GVPaymentDetails.ClientID %>").css('display','none');
$("#<%=LblValidReg.ClientID %>").css('display','none');

Insted Of

 document.getElementById("<%= GVPaymentDetails.ClientId%>").style.display='none';
 document.getElementById('<%= LblValidReg.ClientId%>').style.display='none';

Upvotes: 0

Andrei
Andrei

Reputation: 56688

The ID that you see in the .aspx markup is not the ID that ends up on the client-side page. ASP.NET generates a bunch of stuff in place of this ID. Options you have:

  1. If your javascript is in the same .aspx file, you can embed client side ID into it, like this:

    document.getElementById("<%= GVPaymentDetails.ClientID %>").style.display='none';

  2. If you can give 100% guarantee that there is no other control on the page with the same ID, use static ID mode, which will force ASP.NET to render the exactly same ID on the client side:

    <asp:GridView ID="GVPaymentDetails" ClientIDMode="Static"

    In that case your code will work as is:

    document.getElementById("GVPaymentDetails").style.display='none';

Also as already pointed out in the comments, it will make your live easier to wrap these controls in some kind of a container like Panel or just a div.

Update

In fact if you just put a simple div around them you won't need any of the trickery above:

<div id="GridViewContainerDiv">
    <asp:GridView ID="GVPaymentDetails" ...
    <asp:Label ID="LblValidReg" ...
</div>

document.getElementById("GridViewContainerDiv").style.display='none';

Upvotes: 1

Kaushik Maheta
Kaushik Maheta

Reputation: 1891

<script type="text/javascript">
    function txtOnKeyPress(txt1)
     {
        if (txt1 != 'undefined') 
        {
         document.getElementById("<%= GVPaymentDetails.ClientId%>").style.display='none';
         document.getElementById('<%= LblValidReg.ClientId%>').style.display='none';

        }
     }
</script>

OR

<asp:GridView ID="GVPaymentDetails" runat="server" AutoGenerateColumns="False" ClientIdMode="static" 


<asp:Label ID="LblValidReg" ClientIdMode="Static" runat="server"></asp:Label>

Upvotes: 0

Related Questions