Search code examples
jqueryasp.netrepeater

jQuery returning and setting same value and object from first result inside repeater


Basically i am trying to run some jQuery inside my Repeater and whenever i grab a hiddenfield, it always grabs the value from the first hiddenfield. When setting the value to a div, it only sets it to the first div.

How i can designate the jQuery to use the current repeater items data?

 <asp:Repeater ID="rpt_Product_Videos" runat="server">
     <ItemTemplate>
         <div class="Product_Content_Videos_DIV">
             <div class="jcorg-yt-thumbnail">
                 <a href='http://www.youtube.com/watch?v=<%# Eval("VideoName")%>&feature=youtube_gdata_player' rel="Video[gallery]">
                     <img src='http://i.ytimg.com/vi/<%# Eval("VideoName")%>/1.jpg' width="85" height="64" />
                 </a>
              </div>

                 <a href='http://www.youtube.com/watch?v=<%# Eval("VideoName")%>&feature=youtube_gdata_player' rel="Video[gallery]">
                     <div id="divTitle"></div>
                 </a>
                 <input type="hidden" id="hfVideoName" class="test5" value='<%# Eval("VideoName")%>' />

                            <script>
                                var hfVideoName = $("#hfVideoName").val();
                                $.get('http://gdata.youtube.com/feeds/api/videos/' + hfVideoName + '?v=2&alt=json', function (data) {
                                    $("#divTitle").text(data.entry ? data.entry.title.$t : '');
                                });

                            </script>
                        </div>

                    </ItemTemplate>
                </asp:Repeater>

EDIT:

As stated below, i was able to achieve this by assigning ID's. It was a mess, but works. Not even going to paste the ugly code, but i had an int on the user page starting at 0 and increasing by 1 for each repeater item through JS. in the Code behind i did the same thing to the controls and then in the JS search for the ID plus that int value.


Solution

  • As you iterate through records with the repeater, you will have multiple copies of hfVideoName. As such, when selecting it via jquery using var hfVideoName = $("#hfVideoName").val(); it will always get the first one on the page.

    My suggestion would be to append something to the ID of that div to make it unique, like an ID for example.