Hide/show Hyperlinks

7 posts, 1 answers
  1. Andrew M
    Andrew M avatar
    13 posts
    Member since:
    Dec 2008

    Posted 05 May 2009 Link to this post

    I am uploading images to a database and only want to show a hyperlink if an image was uploaded.

    If a user does not upload a file to the database, I write a null to the "FileBytes" field and in the stored procedure code check for nulls. If a null is found, then I don't update the FileBytes field. This works ok for files already uploaded but if no file has been uploaded, then i get an error when the user click the hypelink in the grid.

    In my aspx page i have the following markup inside a Grid:

     

    ........
    </
    telerik:GridTemplateColumn>

     

     

     

    <telerik:GridTemplateColumn HeaderText="Image" UniqueName="Upload">

     

     

     

        <ItemTemplate>

     

     

     

            <a href="#" onclick='ShowImage("<%# Eval("UID") %>");return false;'>

     

     

     

            <asp:Image runat="server" ID="ImageThumbnail" AlternateText="Click here to open the real size image"

     

     

     

            ImageUrl='<%# "showimagecs.aspx?thumbnail=true&ID=" + Eval("UID")%>' Style="border-width: 0px;" />

     

     

     

            </a>

     

     

     

        </ItemTemplate>

     

     

     

    </telerik:GridTemplateColumn>

     

     

    ........

    How can i hide the click able link if the 'FileBytes' field is empty so the user can't click the link and get an error ie what's the best way of showing a grid cell with nothing in it?

    Kind regards
    Andrew
  2. Todd Anglin
    Todd Anglin avatar
    2040 posts
    Member since:
    Aug 2005

    Posted 05 May 2009 Link to this post

    One of the easiest solutions is to simply use a function to dynamic create the contents of your ItemTemplate, like this:
    <telerik:GridTemplateColumn...
    <ItemTemplate>
    <%# renderImageLink(Eval("UID"), Eval("FileBytes")) %>
    </ItemTemplate>
    ...

    Then, in your server code, you'd do something like:

    public string renderImageLink(int uid, object filebytes){
    if(filebytes == null)
    return String.Empty;

    //Otherwise, build your HTML string and return
    }

    There are other approaches, of course, such as handling the Grid's OnItemDataBound event and programmatically manipulating your cell contents. Give this approach a try, though, and let me know if it helps.

    -Todd
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Andrew M
    Andrew M avatar
    13 posts
    Member since:
    Dec 2008

    Posted 06 May 2009 Link to this post

    Thanks for your reply Todd.
    I've gone ahead and applied your suggestion. It now works for when there is no image... ie the hyperlink doesn't show.
    However, when there is an image, it's now not showing it in the grid as a thumbnail.

    This is my original code. This shows the thumbnail image.

    <

    telerik:GridTemplateColumn HeaderText="Image" UniqueName="Upload">

     

     

    <ItemTemplate>

     

     

        <a href="#" onclick='ShowImage("<%# Eval("UID") %>");return false;'>

     

     

        <asp:Image runat="server" ID="ImageThumbnail" AlternateText="Click here to open the real size image"

     

     

        ImageUrl='<%# "showimagecs.aspx?thumbnail=true&ID=" + Eval("UID")%>' Style="border-width: 0px;" />

     

     

        </a>

     

     

     

    </ItemTemplate>

     

     

    </telerik:GridTemplateColumn>

    With the new suggestion, i now have this code on my aspx page 

     

     

    <telerik:GridTemplateColumn HeaderText="Image" UniqueName="Upload">

     

     

    <ItemTemplate>

     

            <%

    # renderImageLink(Eval("UID"), Eval("FileBytes"))%>

     

     

    </ItemTemplate>

     

     

    </telerik:GridTemplateColumn>

     

    and this in the code behind

     

     

    public string renderImageLink(Object uid, Object filebytes)

     

    {

     

        if (filebytes.ToString().Length == 0)

     

     

            return "&nbsp;[no image test]";

     

     

            
        //Otherwise, build your HTML string and return

     

     

         string szStr = @"<a href=""#"" onclick='ShowImage(""" + uid;

     

        szStr = szStr +

    @""");return false;'>";

     

        szStr = szStr +

    @"<asp:Image runat=""server"" ID=""ImageThumbnail"" AlternateText=""Click here to open the real size image"" ";

     

        szStr = szStr +

    @"ImageUrl='showimagecs.aspx?thumbnail=true&ID=" + uid + "' ";

     

        szStr = szStr +

    @"Style=""border-width: 0px;"" /> ";

     

        szStr = szStr +

    @"</a>[image test]";

     

     

        
        return
    szStr;

     

     

    }

    I've added the [no image test] and [image test] for debug. Even though no image is shown as a thumbnail, when i click [image test], i get to see the full size image in a popup window. Any thoughts?

    Thanks
    Andrew

     

  5. Todd Anglin
    Todd Anglin avatar
    2040 posts
    Member since:
    Aug 2005

    Posted 06 May 2009 Link to this post

    Happy to hear you're getting closer.

    The problem is that you cannot return a ASP.NET Server Control as a string. :) When you do, the server control is not parsed and thus does not display your image. Instead, return a standard HTML image control, like:

    String.Format("<img src='showimagecs.aspx?thumbnail=true&ID={0}' alt='..' />", uid);

    That will enable the browser to successfully parse your HTML and display your image.

    Hope that helps.

    -Todd
  6. Andrew M
    Andrew M avatar
    13 posts
    Member since:
    Dec 2008

    Posted 06 May 2009 Link to this post

    Sorry Todd but i'm lost now.
    Can you please give me an example of what i need on the aspx page and the code behind page.

     

    Thanks

    Andrew

  7. Answer
    Todd Anglin
    Todd Anglin avatar
    2040 posts
    Member since:
    Aug 2005

    Posted 06 May 2009 Link to this post

    Sorry to confuse! Let me add more context to my last snippet and see if it helps. This is what the code should look like in your code behind file method that is returning the HTML for your "thumb cell":

    public string renderImageLink(Object uid, Object filebytes) 
        if (filebytes.ToString().Length == 0) 
            return "&nbsp;[no image test]"
             
        //Otherwise, build your HTML string and return 
        var szStr = new StringBuilder(); 
        szStr.AppendFormat("<a href=\"#\" onclick='ShowImage(\"{0}\");return false;'>", uid); 
      
        szStr.AppendFormt("<img src=\"showimagecs.aspx?thumbnail=true&ID={0}\" alt=\"Click here to open the real size image\" style=\"border:none;\" />", uid); 
     
        szStr.Append("</a>"); 
      
        return szStr.ToString(); 

    The main idea is to simply return HTML from your method, not an ASP.NET Server Control. HTML can be processed by the browser- a ASP.NET Server Control cannot. Apologies if this doesn't compile- doing it free hand in the browser. This should put you on the right path, though.

    Hope it helps.

    -Todd

  8. Andrew M
    Andrew M avatar
    13 posts
    Member since:
    Dec 2008

    Posted 07 May 2009 Link to this post

    Excellent. Thanks Todd.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017