Zugang img-Tag in Asp: Formview in Code-Behind

Question

Ich habe eine ASP.NET-Form und benötigen ein spezielles Image-Tags aktuelles Bild zu überprüfen und vor findet das Markup unter

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="SessionDetails.aspx.cs" Inherits="CodeCamper.UIWebLayer.WebUI.SessionDetails" %> 
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> 
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server"> 
    <script>   
     var changeState = false; 
     var counter = 0; 
     function changeImage(elementaccess) { 
      if (elementaccess == false && changeState == false && document.getElementById("bookmarkimage").getAttribute("src") === "/Images/blue-bookmark.png") { 
       document.getElementById("bookmarkimage").setAttribute("src", "/Images/heart-black.png"); 
       document.getElementById("bookmarkimage").setAttribute("title", "Add To Favorite"); 
      } 
      else if (elementaccess == false && changeState == false && document.getElementById("bookmarkimage").getAttribute("src") === "/Images/heart-black.png") { 
       document.getElementById("bookmarkimage").setAttribute("src", "/Images/blue-bookmark.png"); 
       document.getElementById("bookmarkimage").setAttribute("title", "Add To Favorite"); 
      } 
      else if (counter == 0 && elementaccess == true && (document.getElementById("bookmarkimage").getAttribute("src") === "/Images/heart-black.png" || document.getElementById("bookmarkimage").getAttribute("src") === "/Images/blue-bookmark.png")) { 
       counter = 1; 
       document.getElementById("bookmarkimage").setAttribute("src", "/Images/heart-checked.png"); 
       document.getElementById("bookmarkimage").setAttribute("title", "Remove Favorite"); 
      } 
      else if (counter == 1 && elementaccess == true && document.getElementById("bookmarkimage").getAttribute("src") === "/Images/heart-checked.png") { 
       counter = 0; 
       document.getElementById("bookmarkimage").setAttribute("src", "/Images/blue-bookmark.png"); 
       document.getElementById("bookmarkimage").setAttribute("title", "Add To Favorite"); 
      } 
     } 
    </script> 

    <div class="generalmargin" style="margin-top: 160px"> 
     <%--<asp:Button ID="Buttonback" runat="server" Text="" class="button-back"/>--%> 

    </div> 
    <div id="labelinfo" style="text-align: center;" runat="server"> 
     <span id="spanlabelinfo" class="text-danger" style="align-content: center" runat="server">Error 
     </span> 
    </div> 
    <div style="margin-top: 160px"> 
     <asp:LinkButton ID="ButtonBack" runat="server" class="btn btn-default btn-md glyphicon glyphicon-backward" Text="" OnClientClick="JavaScript:window.history.back(1);return false;"> 
     </asp:LinkButton> 
     <asp:LinkButton ID="ButtonCancel" runat="server" class="btn btn-default btn-md glyphicon glyphicon glyphicon-remove-sign" Text="" OnClick="ButtonCancel_Click"> 
     </asp:LinkButton> 
     <asp:LinkButton ID="ButtonSave" runat="server" class="btn btn-default btn-md glyphicon glyphicon-floppy-disk" Text="" OnClick="ButtonSave_Click"> 
     </asp:LinkButton>   
    </div> 
    <asp:FormView ID="sessionDetail" runat="server" ItemType="CodeCamper.EntityLayer.Transaction.SessionVO" SelectMethod="GetDetails" RenderOuterTable="false"> 
     <ItemTemplate> 
      <div> 
       <h3><%#: Item.SessionTitle %></h3> 
      </div> 
      <br /> 
      <table> 
       <tr> 
        <td style="width:25%">      
         <label>Track</label>&nbsp;&nbsp;&nbsp;<%#: Item.SessionTrack %><br /><label>Time Slot</label>&nbsp;&nbsp;&nbsp;<%#:Item.SessionTimeSlot %><br /><label>Room</label>&nbsp;&nbsp;&nbsp;<%#:Item.SessionRoom %><br /><label>Level</label>&nbsp;&nbsp;&nbsp;<%#:Item.SessionLevel %><br /><label>Tags</label>&nbsp;&nbsp;&nbsp;<%#:Item.SessionTags %><br /><image src='/Images/photos/<%#:Item.ImagePath%>' />       
        </td> 
        <td style="width:75%"><label>Description</label><br /> 
         <div class="pre-scrollable"><%#:Item.SessionBio %></div>      
        </td>     
       </tr> 
       <tr> 
        <td style="width:25%">      
         &nbsp;    
        </td> 
        <td style="width:75%"> 
        <img src='/Images/blue-bookmark.png' ID="bookmarkimage" onmouseover="changeImage(false);" onmouseout="changeImage(false);" onclick="changeImage(true);" /><br /> 
         <br /> 
         <%-- <cc1:Rating ID="SeesionRating" runat="server" 
          StarCssClass="Star" WaitingStarCssClass="WaitingStar" EmptyStarCssClass="Star" 
          FilledStarCssClass="FilledStar" ReadOnly="True" CurrentRating=<%#: int.Parse(Item.SessionRating.ToString()) %>> 
         </cc1:Rating>--%> 
         <cc1:Rating ID="SeesionRating" runat="server" 
          StarCssClass="Star" WaitingStarCssClass="WaitingStar" EmptyStarCssClass="Star" 
          FilledStarCssClass="FilledStar" ReadOnly="True" CurrentRating=<%# Item.SessionRating %>> 
         </cc1:Rating> 
        </td>     
       </tr> 
      </table> 
       <asp:HiddenField runat="server" ID="isAddedFav" Value="0"></asp:HiddenField> 
     </ItemTemplate> 
    </asp:FormView> 
</asp:Content> 

in Code hinter

bewegen

protected void ButtonSave_Click(object sender, EventArgs e) 
     { 
      labelinfo.Visible = true; 
      //HiddenField h1 = sessionDetail.FindControl("isAddedFav") as HiddenField; 
      //labelinfo.InnerHtml = h1.Value; 
      Image h2 = sessionDetail.FindControl("bookmarkimage") as Image; 
      labelinfo.InnerHtml = h2.ImageUrl; 
      labelinfo.Attributes["class"] = "centering text-center text-info"; 
     } 

die Frage ist Bild h2 = sessionDetail.FindControl ("bookmarkimage") als Bild; Gibt null zurück

Ich möchte das Bild überprüfen, ist Herz-checked.png oder nicht

Answer 1

Um das Element in Zugriff auf Code-Behind, es muss die runat="server" Eigenschaft haben:

<img ID="bookmarkimage" runat="server" ... /> 

Es wird als HtmlImage-Element angesehen, nicht als Image-Steuerelement. Sie würden seine Src Eigenschaft anstelle von ImageUrl verwenden.

Eine Alternative wäre, eine Bildsteuerung zu verwenden, die die ImageUrl Eigenschaft aussetzt:

<asp:Image ID="bookmarkimage" runat="server" ... /> 

Mit Server steuert, wird die ID des Elements (insbesondere innerhalb einer Databound-Steuerung mit dem Bild) verstümmelt werden, so dass document.getElementById('bookmarkimage') das Element nicht finden. Sie können, indem man das Bild als Argument für changeImage dieses Problem lösen, das this Schlüsselwort:

<img ID="bookmarkimage" runat="server" src='/Images/blue-bookmark.png' onmouseover="changeImage(this, false);" onmouseout="changeImage(this, false);" onclick="changeImage(this, true);" /> 

mit dem Element als ersten Parameter, die Javascript-Funktion muss sie nicht im HTML-Dokument finden:

function changeImage(bookmarkImage, elementaccess) { 
    if (elementaccess == false && changeState == false && bookmarkImage.getAttribute("src") === "/Images/blue-bookmark.png") { 
     bookmarkImage.setAttribute("src", "/Images/heart-black.png"); 
     bookmarkImage.setAttribute("title", "Add To Favorite"); 
    } 
    else if (elementaccess == false && changeState == false && bookmarkImage.getAttribute("src") === "/Images/heart-black.png") { 
     bookmarkImage.setAttribute("src", "/Images/blue-bookmark.png"); 
     bookmarkImage.setAttribute("title", "Add To Favorite"); 
    } 
    else if (counter == 0 && elementaccess == true && (bookmarkImage.getAttribute("src") === "/Images/heart-black.png" || bookmarkImage.getAttribute("src") === "/Images/blue-bookmark.png")) { 
     counter = 1; 
     bookmarkImage.setAttribute("src", "/Images/heart-checked.png"); 
     bookmarkImage.setAttribute("title", "Remove Favorite"); 
    } 
    else if (counter == 1 && elementaccess == true && bookmarkImage.getAttribute("src") === "/Images/heart-checked.png") { 
     counter = 0; 
     bookmarkImage.setAttribute("src", "/Images/blue-bookmark.png"); 
     bookmarkImage.setAttribute("title", "Add To Favorite"); 
    } 
} 

In Code hinter wird das Element als Introduction:

System.Web.UI.HtmlControls.HtmlImage h2 = sessionDetail.FindControl("bookmarkimage") as System.Web.UI.HtmlControls.HtmlImage; 
labelinfo.InnerHtml = h2.Src;