how to show or hide div on button click in repeater in asp.net?

Question

how to show or hide div on button click in repeater in asp.net?

Diksha dudi 126

i want to show the content on button click and hide on again button click, button and div is in repeater. Here is the code I tried , and also want the current div status hidden.

Accepted answer

0 additional answers

Your answer

Answer 1

Lan Huang-MSFT 30,191 Microsoft External Staff

Hi @Diksha dudi ,
In the repeater you can use FindControl to find the div.
Dim sample As HtmlGenericControl = TryCast(b.Parent.FindControl("div1"), HtmlGenericControl)
Page.FindControl(String) Method:searches the page naming container for a server control with the specified identifier.
https://learn.microsoft.com/en-us/dotnet/api/system.web.ui.page.findcontrol?view=netframework-4.8
You can refer to the example below.

Protected Sub OnMyCommand1(ByVal sender As Object, ByVal e As CommandEventArgs)  
    Dim b As LinkButton = TryCast(sender, LinkButton)  
    Dim sample As HtmlGenericControl = TryCast(b.Parent.FindControl("div1"), HtmlGenericControl)  
  
    If b IsNot Nothing Then  
        Dim c As Label = CType(b.Parent.FindControl("Label1"), Label)  
  
        If c IsNot Nothing Then  
            sample.Visible = False  
            c.Text = "text changed in handler"  
            c.ForeColor = System.Drawing.Color.Green  
        End If  
    End If  
End Sub

Best regards,
Lan Huang

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Diksha dudi 126

I tried this but this is only making it false

Protected Sub showhide(ByVal sender As Object, ByVal e As CommandEventArgs)  
        Dim b As Button = TryCast(sender, Button)  
        Dim detail As HtmlGenericControl = TryCast(b.Parent.FindControl("detail"), HtmlGenericControl)  
  
          
        If b IsNot Nothing Then  
            detail.Visible = False  
        End If  
          
    End Sub

Lan Huang-MSFT 30,191 Microsoft External Staff

Hi @Diksha dudi ,
The first method I provided requires two buttons to achieve what you want,
I wrote another example in JavaScript that will search for "brother" DIV element of the clicked link, and show or hide it.
Note: Each item (in the repeater) needs to be wrapped with a DIV element.
You can refer to this.

<head runat="server">    
    <title></title>  
     <scri pt>  
         fu nction show(oLink, targetDivID) {  
             var arrDIVs = oLink.parentNode.getElementsByTagName("div");  
             for (var i = 0; i < arrDIVs.length; i++) {  
                 var oCurDiv = arrDIVs[i];  
                 if (oCurDiv.id.indexOf(targetDivID) >= 0) {  
                     var blnHidden = (oCurDiv.style.display == "none");  
                     oCurDiv.style.display = (blnHidden) ? "block" : "none";  
                 }  
             }  
             return false;  
         }  
     </sc ript>  
</head>

Best regards,
Lan Huang

Diksha dudi 126

Thanks for the reply , I tried this but on clicking one button content of all div is showing .

<script>  
  
        function show(oLink, targetDivID)  
        {  
              var arrDIVs = oLink.parentNode.getElementsByTagName("div");  
  
              for (var i = 0; i < arrDIVs.length; i++)   
              {  
                  var oCurDiv = arrDIVs[i];  
  
                  if (oCurDiv.id.indexOf(targetDivID) >= 0)   
                  {  
                      var blnHidden = (oCurDiv.style.display == "none");  
                      oCurDiv.style.display = (blnHidden) ? "block" : "none";  
                  }  
              }  
  
              return false;  
        }  
      </script>

Diksha dudi 126 Reputation points

2022-04-29T17:10:16.8+00:00

okay sorry it worked,i didn't wrapper each item in the div.
Thank you so much for solving my problem.

Share via

how to show or hide div on button click in repeater in asp.net?

0 additional answers

Your answer