Hyperlink in ASP.NET MVC Spreadsheet control

30 Jul 20268 minutes to read

Hyperlinks allow users to navigate to web pages, cell references within the current worksheet, or cells in other worksheets. Use the allowHyperlink property to enable or disable hyperlink functionality in the Spreadsheet.

NOTE

The default value of the allowHyperlink property is true.

You can insert a hyperlink into a worksheet cell for quick access to related information.

To insert a hyperlink through the user interface:

  • Select the cell where you want to insert the hyperlink.
  • Open the Insert tab in the Ribbon and choose Link.
  • Alternatively, right-click the cell and choose Hyperlink from the context menu, or press Ctrl + K.
  • Enter the destination and display text in the dialog, and apply the changes.

You can also use the addHyperlink() method to insert a hyperlink programmatically.

You can change an existing hyperlink in your workbook by changing its destination or the text that is used to represent it.

User Interface:

In the active spreadsheet, Select the cell that contains the hyperlink that you want to change. Editing the hyperlink while opening the dialog can be done by any one of the following ways:

  • Select the INSERT tab in the Ribbon toolbar and choose the Link item.
  • Right-click the cell and then click Edit Hyperlink item in the context menu, or you can press Ctrl+K.

In the Edit Link dialog box, make the changes that you want, and click UPDATE.

Performing this operation remove a single hyperlink without losing the display text.

User Interface:

In the active spreadsheet, click the cell where you want to remove a hyperlink. remove hyperlink can be done by any of the following ways:

  • Right-click the cell and then click Remove Hyperlink item in the context menu.
  • Use the removeHyperlink() method programmatically.

The beforeHyperlinkClick event is triggered before a hyperlink is opened. Use the target property in the event arguments to specify where the hyperlink opens.

@Html.EJS().Spreadsheet("spreadsheet").BeforeHyperlinkClick("beforeHyperlinkClick").Sheets(sheet =>
   {
       sheet.Name("PriceDetails").SelectedRange("D13").Rows(row =>
       {
           row.Cells(cell =>
           {
               cell.Value("Item Name").Add();
               cell.Value("Quantity").Add();
               cell.Value("Price").Add();
               cell.Value("Amount").Add();
               cell.Value("Stock Detail").Add();
               cell.Value("Website").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Casual Shoes").Add();
               cell.Value("10").Add();
               cell.Value("$20").Add();
               cell.Value("$200").Add();
               cell.Value("OUT OF STOCK").Add();
               cell.Value("Amazon").Hyperlink("www.amazon.com").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Sports Shoes").Add();
               cell.Value("20").Add();
               cell.Value("$30").Add();
               cell.Value("$600").Add();
               cell.Value("IN STOCK").Hyperlink("Stock!A3:B3").Add();
               cell.Value("Overstack").Hyperlink("www.overstock.com").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Formal Shoes").Add();
               cell.Value("20").Add();
               cell.Value("$15").Add();
               cell.Value("$300").Add();
               cell.Value("IN STOCK").Hyperlink("Stock!A2:B2").Add();
               cell.Value("AliExpress").Hyperlink("www.aliexpress.com").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Sandals & Floaters").Add();
               cell.Value("15").Add();
               cell.Value("$20").Add();
               cell.Value("$300").Add();
               cell.Value("OUT OF STOCK").Add();
               cell.Value("Alibaba").Hyperlink("www.alibaba.com").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Flip-Flops & Slippers").Add();
               cell.Value("30").Add();
               cell.Value("$10").Add();
               cell.Value("$300").Add();
              cell.Value("IN STOCK").Hyperlink("Stock!A4:B4").Add();
               cell.Value("Taobao").Hyperlink("www.taobao.com").Add();
           }).Add();
       }).Columns(column =>
       {
           column.Width(110).Add();
           column.Width(115).Add();
           column.Width(110).Add();
           column.Width(100).Add();
           column.Width(100).Add();
       }).Add();
       sheet.Name("Stock").SelectedRange("D13").Rows(row =>
       {
           row.Cells(cell =>
           {
               cell.Value("Item Name").Add();
               cell.Value("Available Count").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Casual Shoes").Add();
               cell.Value("30").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Sports Shoes").Add();
               cell.Value("25").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Formal Shoes").Add();
               cell.Value("40").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Sandals & Floaters").Add();
               cell.Value("15").Add();
           }).Add();
           row.Cells(cell =>
           {
               cell.Value("Flip-Flops & Slippers").Add();
               cell.Value("30").Add();
           }).Add();
       }).Columns(column =>
       {
           column.Width(110).Add();
           column.Width(115).Add();
       }).Add();
   }).Render()


<script>

    function beforeHyperlinkClick(args) {
        args.target = '_self'; //change target attribute
    }

</script>
public ActionResult Index()
{
    return View();
}

Limitations

  • Inserting hyperlink not supported for multiple ranges.

See Also