Get Clientid For A Specific User Control Bounded In A Repeater

iv'e got a list of user controls which i bind to a repeater . the user control : (Example) 'AppProduct'

Copy

For older .NET use

'<%= Control.ClientID %>'

For your case

functionGet_Product_Details(uc) {
     var hidden_pid = uc.getElementById('<%= pid.ClientID %>');
  }

Solution 2:

i found a work around for this problem

first i set the repeater ClientIDMode:

<asp:RepeaterID="Repeater1"runat="server"ClientIDMode="Predictable"><ItemTemplate><App:ProductID="prd1"runat="server" /></ItemTemplate></asp:Repeater>

secondly i added a function to the btn_details on clientClick

<asp:ButtonID="btn_details"runat="server"Text="פרטים נוספים"OnClientClick="Get_Product_Details(this);" />

in that function i extract the client id for the button and resolved the client id for the hidden field pid

<asp:HiddenFieldID="pid"runat="server"Value="5"/>

the function which will extract the client id //ContentPlaceHolder1_Repeater1_Prd_2_pid_2:

          function Get_Product_Details(btn) {
//ContentPlaceHolder1_Repeater1_Prd_2_btn_details_2
var s = btn.id;
var start = s.indexOf("btn_details");
var end = s.lastIndexOf("_");
sub = s.substring(start, end);
s = s.replace(sub, "pid");
var hidden = document.getElementById(s);
var id = hidden.value;

Solution 3:

Since a repeater can include multiple instances of your control, it will append a number to the ID to uniquely identify it. Use jQuery to find the other element relative to the button. .siblings() should do the trick.

Solution 4:

instead of using an hidden element for the pid on the button, you could instead attach the value via the jquery .data:

private StringBuilder builder; 

 publicvoid Page_Load(object sender, EventArgs e)
 {
     Repeater1.ItemDataBound += generateData;
     Repeater1.DataBound += outputGeneratedData;
     if (!Postback)
     {  
       List<Product> products = newList<Product>();
       // generate our data to bind
       Repeater1.DataSource = products;
       Repeater1.DataBind();
     }
 }
 // it is possible to do this inside the user control as well on page_load which would simplify it.publicvoid generateData(objectSender, RepeaterItemEventArgs e)
 {
      if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
      {
            // presumes your custom control is the first control in the repeater.. if not you can use FindControl to get the relevent controly
           MyUserControl ctl = (MyUserControl)e.item.Controls[0];
           // you could expose the buttons id in a property on the control but if prefered just use FindControl.
            builder.AppendFormat("$('{0}').data('PID','{1}');", ctl.FindControl('btn_details').ClientID ,((Product)e.item.DataItem).ProductID); 
      }
  }

  publicvoid outputGeneratedData(object sender,Eventargs e)
  { 
        Response.Write(@"<script type='text/javascript'> + builder.ToString() + "</script>");
  }

an access it like this on though the client js item:

functionGet_Product_Details(item)
 { 
        var productId =  $(item).data('ProductID');
 }

Share