Skip to main content

How to create a hyperlink that contains both image and text elements

  • 5 minutes to read

This example demonstrates how to create a custom user control with an ASPxHyperLink that contains both image and text elements. The sample web page contains two customized ImageLink controls. The “NavigateUrl” property of the second control contains a unique parameter that keeps the hyperlink unvisited. This is done to show visited and unvisited links in different styles. The styles in the user control allow the image and text to look like a single hyperlink. The dxeHyperlink class changes the standard DevExpress theme and the dxeHyperlink_BlackGlass class specifies the BlackGlass theme. For other themes, specify dxeHyperlink_[Theme_Name] classes in the same way. To overcome differences in how Firefox and other browsers render data, a special “hyperlink_ff” style was created. When the Firefox browser is used, the style is applied in the Init event handler of every custom ImageLink user control. You can use the same approach to overcome difficulties with other browsers.

using DevExpress.Web;
using DevExpress.Web.ASPxEditors;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e) {
        //This line is used for the demo purpose
        uc1.NavigateUrl = uc1.NavigateUrl +"?id="+ DateTime.Now.Millisecond.ToString();
    }
}