Disable button .Net Core MVC view

Question

I have button in my view.cshtml file:

<td>
    @if(@ViewBag.loading == false){
        @Html.ActionLink(
            "Run Test",
            "RunSingleTest",
            new { [email protected]_type, [email protected]},
            new { @class = "btn btn-info" })
    }
</td>

Which triggers method in HomeController.cs:

public IActionResult RunSingleTest(string testName, int id)
{
    _service.RunSingleTest(testName, id);
    var items = _service.GetDetailsById<List>(id);
    return View("TestDetails", items);
}

I want to disable this button when user clicks on that button. Should I do it with JQuery/Javascript? How do you pass that button id to script and where to put that id?

that is an anchor and anchors don't have disable property. You could either href="javascript:void(0) or return false via jQuery. — Manoz
– Manoz, Commented Aug 1, 2018 at 10:21

Manoz · Accepted Answer · 2018-08-01 10:30:45Z

1

You can do it with plain HTML element. Also I don't see any benefit of disabling button on click since you want to let users know that this button should not perform more. Better put it disabled when it renders.

@if(ViewBag.loading == false){
  <a href="javascript:void(0)" class="btn btn-info btn-disabled" id="@item.Id" testName="@item.Test_type">Run Test</a>
}

or if you would like disable it literally then go with jQuery with giving an element a specific class -

<a href="/RunSingleTest" class="btn btn-info myBtn" ...> Run Test </a>

$('.myBtn').on('click',function(e){
  $(this).addClass('btn-disabled');
  e.PreventDefault() //preventing to navigate
});

edited Aug 1, 2018 at 10:30

answered Aug 1, 2018 at 10:25

Manoz

6,62713 gold badges72 silver badges117 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Fuzzybear · Accepted Answer · 2018-08-01 10:26:36Z

0

According to the question here you can not just set the disabled property on the actionlink. Instead here shows that you can do it with jQuery Javascript

@Html.ActionLink("Run Test", "RunSingleTest, 
       new { [email protected]_type, [email protected]}, 
       new { class = "btn btn-info linkdisabled" })

CSS

.linkdisabled{
   cursor:text;
}

JQuery

$function(){
    $(".linkdisabled").click(function(){
        return false;
    }
}

answered Aug 1, 2018 at 10:26

Fuzzybear

1,4212 gold badges28 silver badges44 bronze badges

Collectives™ on Stack Overflow

Disable button .Net Core MVC view

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related