# Imaginary \[dot:Hyperlink\] control comes to life (or at least tries to)

**URL:** <https://forum.dotvvm.com/t/imaginary-dot-hyperlink-control-comes-to-life-or-at-least-tries-to/250>\
**Category:** Discussion in English\
**Created:** [August 30, 2024, 8:18pm UTC](https://forum.dotvvm.com/t/imaginary-dot-hyperlink-control-comes-to-life-or-at-least-tries-to/250 "2024-08-30T20:18:56Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![MarianV](https://forum.dotvvm.com/letter_avatar_proxy/v4/letter/m/c0e974/32.png) [@MarianV](https://forum.dotvvm.com/u/MarianV)\
**Post date:** [August 30, 2024, 8:18pm UTC](https://forum.dotvvm.com/t/imaginary-dot-hyperlink-control-comes-to-life-or-at-least-tries-to/250/1 "2024-08-30T20:18:56Z")

</div>

It’s alive!

Hmm, I’ve quickly figured out that there’s no equivalent DotVVM control for the WebForms’ `asp:Hyperlink` control, so I’ve ventured to make one based on `HtmlGenericControl` and by looking at the code of `<bp:Button` and `dot:LinkButton` controls.

Why? Because I want the Enable true/false feature from the asp control that you do not have when using just the HTML anchor (`<a>`):

 ![image](https://forum.dotvvm.com/uploads/default/original/1X/907365e49eb1f354cbf48204d32cd960a41f7d0f.png)

So far, it seems to work well and the coder makes silly happy jokes…  
but there’s something

 ![image](https://forum.dotvvm.com/uploads/default/original/1X/52f26e636e3a2ed6ef8d559026d6356d8ae5e392.png)

These two CSS classes sync with the Enabled state and they’re just boilerplate, repeating on each and every `Link` control.

My question is: how can I integrate this into the code control ?  
Looking into the options for the `IHtmlWriter` comes up with some methods that seem to be purposed for adding CSS classes but no sign of their counterparts for removing CSS classes:  
 ![image](https://forum.dotvvm.com/uploads/default/original/1X/fdfccf986b4665b27bc7d679f810371261fc5362.png)

I can send you the control’s code if needed.

PS:  
When I disable the Link control I also need to make `Href = null` otherwise the link will still be usable in the UI despite the `disabled="disabled"` being applied, this being so because it renders an `<a>` tag in the HTML for which that attribute is not officially valid, from what I’ve understood. But I’m wondering how to integrate this also into the control’s code. The toggling of the href attr in sync with the enabling/disableing, I mean.

---

<div class="post-metadata">

**Author:** ![exyi](https://forum.dotvvm.com/user_avatar/forum.dotvvm.com/exyi/32/9_2.png) [@exyi](https://forum.dotvvm.com/u/exyi)\
**Post date:** [August 31, 2024, 9:11am UTC](https://forum.dotvvm.com/t/imaginary-dot-hyperlink-control-comes-to-life-or-at-least-tries-to/250/2 "2024-08-31T09:11:54Z")

</div>

To disable the link, you can add the `dotvvm-enable` knockout binding even if Enabled is a static value (`writer.AddKnockoutDataBind("dotvvm-enable", "false")` after `AddAtrribute("disabled", ...)`

Since you inherit from `HtmlGenericControl`, the easiest way add the class binding is to insert it into the `CssClasses` collection:

```auto
this.CssClasses.Add("link-btn", this.GetValueOrBinding<bool>(EnabledProperty));

this.CssClasses.Add("link-btn-disabled", this.GetValueOrBinding<bool>(EnabledProperty).Negate());

```

---

<div class="post-metadata">

**Author:** ![MarianV](https://forum.dotvvm.com/letter_avatar_proxy/v4/letter/m/c0e974/32.png) [@MarianV](https://forum.dotvvm.com/u/MarianV)\
**Post date:** [August 31, 2024, 12:05pm UTC](https://forum.dotvvm.com/t/imaginary-dot-hyperlink-control-comes-to-life-or-at-least-tries-to/250/3 "2024-08-31T12:05:01Z")

</div>

> [@exyi](#):
>
> To disable the link, you can add the `dotvvm-enable` knockout binding even if Enabled is a static value (`writer.AddKnockoutDataBind("dotvvm-enable", "false")` after `AddAtrribute("disabled", ...)`

Unfortunately I didn’t understand this paragraph.  
The Enabled control property has a dynamic value (it is value bound):  
 ![image](https://forum.dotvvm.com/uploads/default/original/1X/11e2afbec5bc7eb1929eb9e70b57d1bd11f5b647.png)

Fortunately, your suggestion for the CSS classes worked. Here’s the result:

 ![image](https://forum.dotvvm.com/uploads/default/original/1X/3fc8647de62d43cbe87f8448b7278254635bec13.png)

---

<div class="post-metadata">

**Author:** ![exyi](https://forum.dotvvm.com/user_avatar/forum.dotvvm.com/exyi/32/9_2.png) [@exyi](https://forum.dotvvm.com/u/exyi)\
**Post date:** [September 7, 2024, 6:22pm UTC](https://forum.dotvvm.com/t/imaginary-dot-hyperlink-control-comes-to-life-or-at-least-tries-to/250/4 "2024-09-07T18:22:51Z")

</div>

If the Enabled property is bound to a value binding, my suggestion is irrelevant. Just if you would like to also support hardcoded values (or resource bindings), you might still want add `data-bind="dotvvm-enable: false"`, which blocks clicks on the link.

---

<div class="post-metadata">

**Author:** ![MarianV](https://forum.dotvvm.com/letter_avatar_proxy/v4/letter/m/c0e974/32.png) [@MarianV](https://forum.dotvvm.com/u/MarianV)\
**Post date:** [September 8, 2024, 3:53pm UTC](https://forum.dotvvm.com/t/imaginary-dot-hyperlink-control-comes-to-life-or-at-least-tries-to/250/5 "2024-09-08T15:53:20Z")

</div>

> [@exyi](#):
>
> you might still want add `data-bind="dotvvm-enable: false"`, which blocks clicks on the link.

I see that when dealing with other ways of enabling/disabling the Link control (besides the case of value binding Enabled to a bool variable - that works) the code needs something else.

I tried resolving it for these other cases: resource binding to variable, resource binding to true/false, simple static binding (Enabled=“true” or false) and value binding to true/false and did not succeed. I don’t know how to write this code, tried all sorts of versions with no luck in satisfying all the cases. Please help!

What I got now:

 ![image](https://forum.dotvvm.com/uploads/default/original/1X/84fb479ced7e81efa51fee4fc77117e14b0752ed.png)

At least I know that:

1. I don’t know how to properly apply your suggestion of `data-bind="dotvvm-enable: false"`;
2. removing the href attribute from the anchor element ensures the link is disabled but I don’t have a `writer.RemoveAttribute` method. And only adding it by KO data binding by using `writer.AddAttribute` does not work like it works for the “disabled” attr.

Worth mentioning that those two lines dealing with CSS class toggling do not work for the case of resource binding to variable.

PS:

I tried with this:

 ![image](https://forum.dotvvm.com/uploads/default/original/1X/1533326831312abe7164cb2f51b270fcbfc54e8c.png)

And with this:

 ![image](https://forum.dotvvm.com/uploads/default/original/1X/c77d3a5173e9c994b5e0c7f22eba0d2a2125ff28.png)
