locked
hyperlink in girdiview has to be hidden or visible by click of a checkbox RRS feed

  • Question

  • User219039814 posted

    I have a gridview with three columns

    Checkbox, Employee ID, Hyperlink

    On page load Hyperlink column is hidden.

    By clicking on the checkbox of the corresponding employee id, the hyperlink should be made visible

    I tried to use

    grdEmailStatus.Rows[1].Visible = true; 

    in checkbox selectedindex changed. with autopostback true.

    But it does not work.. I know that in the postback, the hyperlink is visible is false.

    Can some one help me?

    Thursday, August 30, 2018 7:31 AM

Answers

  • User-1171043462 posted

    Here's a simple example.

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
            <Columns>
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:CheckBox runat="server" OnCheckedChanged = "OnCheckedChanged" AutoPostBack = "true" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:BoundField DataField="Id" HeaderText="Customer Id" ItemStyle-Width="90" />
                <asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width="120" />
                <asp:BoundField DataField="Country" HeaderText="Country" ItemStyle-Width="100" />
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:HyperLink ID = "lnk" runat="server" Text = "View" NavigateUrl = "#" Visible = "false" />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
     protected void Page_Load(object sender, EventArgs e)
        {
            if (!this.IsPostBack)
            {
                DataTable dt = new DataTable();
                dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Id"), new DataColumn("Name"), new DataColumn("Country") });
                dt.Rows.Add(1, "John Hammond", "United States");
                dt.Rows.Add(2, "Mudassar Khan", "India");
                dt.Rows.Add(3, "Suzanne Mathews", "France");
                dt.Rows.Add(4, "Robert Schidner", "Russia");
                GridView1.DataSource = dt;
                GridView1.DataBind();
            }
        }
    
        protected void OnCheckedChanged(object sender, EventArgs e)
        {
            GridViewRow row = (sender as CheckBox).NamingContainer as GridViewRow;
            row.FindControl("lnk").Visible = (sender as CheckBox).Checked;
        }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, August 30, 2018 10:06 AM
  • User-893317190 posted

    Hi vijaylakshmi ,

    You could also use jquery to meet your requirement, please don't set the checkbox's autopostback property to true when you use this way.

    Below is my code.

    <form id="form1" runat="server">
          <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EntryNo" DataSourceID="SqlDataSource1">
              <Columns>
                  <asp:BoundField DataField="EntryNo" HeaderText="EntryNo" InsertVisible="False" ReadOnly="True" SortExpression="EntryNo" />
                  <asp:BoundField DataField="Code" HeaderText="Code" SortExpression="Code" />
                  <asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
    
                 <asp:TemplateField>
                     <ItemTemplate>
                         <asp:CheckBox ID="CheckBox1" runat="server" />  <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("entryno","~/gridView2/EntryDetail.aspx?id={0}") %>' Text="Detail"   ></asp:HyperLink>
                     </ItemTemplate>
                 </asp:TemplateField>
              </Columns>
            
        </asp:GridView>
    
            <script>
                $(function () {
                    $("#GridView1 :checkbox").each(
                        function () {
                            if ($(this).prop("checked")) {
                                $(this).siblings("a").show();
                            } else {
                                 $(this).siblings("a").hide();
                            }
    
                        });
                  
                    $("#GridView1 :checkbox").change(
                        function () {
                            if ($(this).prop("checked")) {
                                $(this).siblings("a").show();
                            } else {
                                 $(this).siblings("a").hide();
                            }
                            
    
                        }
                    )
    
                })
    
            </script>

    The result.

    Best regards,

    Ackerly Xu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, August 31, 2018 7:13 AM

All replies

  • User-1716253493 posted

    use findcontrols for templatefield or controls(0) for hyperlinkfield

        Protected Sub CheckBox1_CheckedChanged(sender As Object, e As EventArgs) Handles
        CheckBox1.CheckedChanged
            Dim cb As CheckBox = CType(sender, CheckBox)
            Dim row As GridViewRow = CType(cb.NamingContainer, GridViewRow)
    
            row.Controls(0).Visible = cb.Checked
        End Sub

    The sample is in VB, i guess it's not hard to change it to C#

    Thursday, August 30, 2018 8:47 AM
  • User219039814 posted

    Yes sir, i already did this in C#.. in oncheckedchange event of checkbox with autopostback property.

    But on postback the column that i want to make visible become hidden again.. 

    Thursday, August 30, 2018 9:18 AM
  • User-1171043462 posted

    Here's a simple example.

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
            <Columns>
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:CheckBox runat="server" OnCheckedChanged = "OnCheckedChanged" AutoPostBack = "true" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:BoundField DataField="Id" HeaderText="Customer Id" ItemStyle-Width="90" />
                <asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width="120" />
                <asp:BoundField DataField="Country" HeaderText="Country" ItemStyle-Width="100" />
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:HyperLink ID = "lnk" runat="server" Text = "View" NavigateUrl = "#" Visible = "false" />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
     protected void Page_Load(object sender, EventArgs e)
        {
            if (!this.IsPostBack)
            {
                DataTable dt = new DataTable();
                dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Id"), new DataColumn("Name"), new DataColumn("Country") });
                dt.Rows.Add(1, "John Hammond", "United States");
                dt.Rows.Add(2, "Mudassar Khan", "India");
                dt.Rows.Add(3, "Suzanne Mathews", "France");
                dt.Rows.Add(4, "Robert Schidner", "Russia");
                GridView1.DataSource = dt;
                GridView1.DataBind();
            }
        }
    
        protected void OnCheckedChanged(object sender, EventArgs e)
        {
            GridViewRow row = (sender as CheckBox).NamingContainer as GridViewRow;
            row.FindControl("lnk").Visible = (sender as CheckBox).Checked;
        }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, August 30, 2018 10:06 AM
  • User-1716253493 posted

    Don't bind the data every postback, calling databind() will reset back to hidden.

    Thursday, August 30, 2018 10:28 PM
  • User-893317190 posted

    Hi vijaylakshmi ,

    You could also use jquery to meet your requirement, please don't set the checkbox's autopostback property to true when you use this way.

    Below is my code.

    <form id="form1" runat="server">
          <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EntryNo" DataSourceID="SqlDataSource1">
              <Columns>
                  <asp:BoundField DataField="EntryNo" HeaderText="EntryNo" InsertVisible="False" ReadOnly="True" SortExpression="EntryNo" />
                  <asp:BoundField DataField="Code" HeaderText="Code" SortExpression="Code" />
                  <asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
    
                 <asp:TemplateField>
                     <ItemTemplate>
                         <asp:CheckBox ID="CheckBox1" runat="server" />  <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("entryno","~/gridView2/EntryDetail.aspx?id={0}") %>' Text="Detail"   ></asp:HyperLink>
                     </ItemTemplate>
                 </asp:TemplateField>
              </Columns>
            
        </asp:GridView>
    
            <script>
                $(function () {
                    $("#GridView1 :checkbox").each(
                        function () {
                            if ($(this).prop("checked")) {
                                $(this).siblings("a").show();
                            } else {
                                 $(this).siblings("a").hide();
                            }
    
                        });
                  
                    $("#GridView1 :checkbox").change(
                        function () {
                            if ($(this).prop("checked")) {
                                $(this).siblings("a").show();
                            } else {
                                 $(this).siblings("a").hide();
                            }
                            
    
                        }
                    )
    
                })
    
            </script>

    The result.

    Best regards,

    Ackerly Xu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, August 31, 2018 7:13 AM