ASP.net Core Conditional disable icon

Question

Having tried what feels like everything, including the following, I can't find a way of disabling the edit icon based on a condition.

<a asp-action="Edit" asp-route-id="@item.Id" disabled="@ViewBag.status">
  <i class="fas fa-edit disabled" style="color:darkolivegreen" title="Edit Bundle" disabled="@ViewBag.status"></i>
</a>

@DimitrisMaragkos It's set as bool in Controller. I checked the output in an
tag so it is being set. — A Cameron, Sep 30 '22 at 13:56
Try adding `a[disabled] { pointer-events: none; }` to your css styles. Check this: https://stackoverflow.com/questions/10276133/how-to-disable-html-links — Dimitris Maragkos, Sep 30 '22 at 14:09

score 0 · Answer 1 · answered Oct 03 '22 at 02:52

<a> doesn't have disable feature. We need to use pointer-events. Try code below:

<a asp-action="Edit" asp-route-id="@item.Id" style="pointer-events:@(ViewBag.status ? "none":"auto" )">
    <i class="fas fa-edit disabled" style="color:darkolivegreen;" title="Edit Bundle" >jump</i>
</a>

score 0 · Accepted Answer · answered Oct 04 '22 at 16:08

I wrapped two button options: one enabled and a one disabled in an if(){} and that worked, although not very elegant. Here is the code:

<div class="form-group">
  @{
    if (ViewBag.missing == 0)
    {
      <input type="submit" class="btn btn-primary" disabled="disabled" value="Select Node(s)" />
    }
    else
    {
      <input type="submit" class="btn btn-primary" value="Select Node(s)" />
    }
  }
</div>

ASP.net Core Conditional disable icon

tag so it is being set.

2 Answers2