locked
Hide image control if no image RRS feed

  • Question

  • User1510859543 posted

    I would like to hide an html file element and asp.net image control when no image is found.  I have the following markup inside the ItemTemplate of a ListView control.

    <asp:Image ID="imgPartPhoto" runat="server" Width="100" onclick="showbig(this);" />
    <input type="file" id='<%# Eval("InventoryID") %>' />
    

    In the ItemDatabound event in my code behind I am using the following code to populate images on each row.  I want to be able to hide both controls when an image does not exists. I tried using File.Exists but that did not work.

            If e.Item.FindControl("imgPartPhoto") IsNot Nothing Then
                Dim lbl As Label
                Dim img As Image = e.Item.FindControl("imgPartPhoto")
                Dim strurl As String = ConfigurationManager.AppSettings("appurl")
                Dim strurlPhy As String = Server.MapPath("~/Photos/_Parts/") & rowView("InventoryID") & ".jpg"
                strurl = "../Photos/_Parts/" & rowView("InventoryID") & ".jpg"
                img.ImageUrl = strurl
    
            End If
    

    Wednesday, January 23, 2019 10:26 PM

Answers

  • User61956409 posted

    Hi dlchase,

    I would like to hide an html file element and asp.net image control when no image is found. 

    You can also achieve the requirement on client side by executing a JavaScript if an error occurs when loading an image, like below.

    <asp:Image ID="imgPartPhoto" runat="server" Width="100" onerror="hideimg_Func(this)" onclick="showbig(this);" />
    <input type="file" id='<%# Eval("InventoryID") %>' />
    <script>
        function hideimg_Func(imgtag) {
            $(imgtag).hide();
    
            $(imgtag).next("input[type='file']").hide();
        }
    </script>

    With Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, January 24, 2019 2:30 AM

All replies

  • User475983607 posted

    In the ItemDatabound event in my code behind I am using the following code to populate images on each row.  I want to be able to hide both controls when an image does not exists. I tried using File.Exists but that did not work.

    Where is the Exists code?

    img.Visible = File.Exists(strurlPhy)

    Are you sure ../Photos is correct?  This code find a file relative to the root.

    Dim strurlPhy As String = Server.MapPath("~/Photos/_Parts/") & rowView("InventoryID") & ".jpg"

    This code assumes the path is one level up.

    strurl = "../Photos/_Parts/" & rowView("InventoryID") & ".jpg"

    There is no guarantee both are correct.  Perhaps run your code through the visual studio debugger.

    Wednesday, January 23, 2019 11:19 PM
  • User-943250815 posted

    You ca set control property Visible = False. but have to check if file exist on physical path

    Dim img as Image = e.FindControl("imgPartPhoto")
    Dim RootDir as string = HttpRuntime.AppDomainAppPath 
    Dim ImgDir as string = IO.Path.GetFullPath(RootDir& <path from root dir>)
    Dim ImgFileFull as string = ImgDir & "\" & <image file name with extension>
    Dim FileExists as boolean = File.Exists(ImgFileFull)
    if FileExists then
     img.Visible = True
    else
    img.Visible = false
    endif



    Wednesday, January 23, 2019 11:20 PM
  • User61956409 posted

    Hi dlchase,

    I would like to hide an html file element and asp.net image control when no image is found. 

    You can also achieve the requirement on client side by executing a JavaScript if an error occurs when loading an image, like below.

    <asp:Image ID="imgPartPhoto" runat="server" Width="100" onerror="hideimg_Func(this)" onclick="showbig(this);" />
    <input type="file" id='<%# Eval("InventoryID") %>' />
    <script>
        function hideimg_Func(imgtag) {
            $(imgtag).hide();
    
            $(imgtag).next("input[type='file']").hide();
        }
    </script>

    With Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, January 24, 2019 2:30 AM