Флажок для изображений в элементе управления ретранслятора ASP.NET

Question

Я работаю с ASP.NET. Я использую ретранслятор для отображения изображений, и я также использую флажок для каждого изображения.

Как выбрать отдельные изображения и обновить их значения в соответствии с идентификатором изображения?

Мой код:

<asp:Repeater ID="Repeater1" runat="server"> 
     <ItemTemplate> 
      <img ID="ImageZoom" runat="server" 
       src='<%# DataBinder.Eval(Container.DataItem, "ImageUrl") %> ' 
       style="display: inline; height:auto; left: 0pt; top: 0pt; 
       width:auto;" /> 
      <asp:CheckBox ID="CheckBox1" runat="server" /> 
     </ItemTemplate> 
</asp:Repeater> 

Answer 1

Вы можете использовать JavaScript, чтобы осуществить это, что-то вроде этого следует сделать трюк:

Без JQuery

<asp:Repeater ID="Repeater1" runat="server"> 
     <ItemTemplate> 
      <img ID="ImageZoom" runat="server" 
       onclick="imageClickHandler(this,event);" 
       src='<%# DataBinder.Eval(Container.DataItem, "ImageUrl") %> ' 
       style="display: inline; height:auto; left: 0pt; top: 0pt; 
       width:auto;" /> 
      <asp:CheckBox ID="CheckBox1" runat="server" /> 
     </ItemTemplate> 
</asp:Repeater> 

function imageClickHandler(s,e){ 
//do something with the current image that is being clicked on. 
//The parameter 's' is a reference to the caller of this method and the 'e' contains 
//event data 
} 

С JQuery

Если вы используете JQuery, вы можете попробовать что-то вроде этого:

<asp:Repeater ID="Repeater1" runat="server"> 
     <ItemTemplate> 
      <img ID="ImageZoom" runat="server" 
       class="handled" 
       src='<%# DataBinder.Eval(Container.DataItem, "ImageUrl") %> ' 
       style="display: inline; height:auto; left: 0pt; top: 0pt; 
       width:auto;" /> 
      <asp:CheckBox ID="CheckBox1" runat="server" /> 
     </ItemTemplate> 
</asp:Repeater> 

<script type="text/javascript" src="jquery-1.7.3"></script> 
$(function(){ 
    $("img.handled").click(function(){ 
    //alerts the id of the image thats being clicked on. 
    alert($(this).attr("id")); 
    }); 
});