Actionlink and button disabled when pressed

Question

Im trying to disable a button and action link when the action link is pressed. I have tried everything online and nothing seams to work any suggestions?

my html code:

<button type="button" id="cancel" class="btn btn-default" data-dismiss="modal">Cancel</button>
@Html.ActionLink("Yes", "RemoveHandler", new { path = x }, new { onclick = "disable()" })

js:

function disable() {
    document.getElementById("cancel").disabled = true;
    document.getElementById("ok").disabled = true;
}

Savan S · Answer 1 · 2018-06-07T10:21:46.827

1

MVC razor is generating <a> tag from @Html.ActionLink

There is no html attribute to disable <a> tag. You have to remove it.

Although you can remove href and it will be same thing as disabling. Or you can set href to "#" or "javascript:void(0)"

Try This

function disable() { document.getElementById("mylink").href = "javascript:void(0)"; }

Put id in ActionLink

@Html.ActionLink("Yes", "RemoveHandler", new { path = "asdf" }, new { onclick = "disable()" , id="mylink"})

edited Jun 07 '18 at 10:21

answered Jun 07 '18 at 07:07

Savan S

407
4
19

What you want to disable? href or onclick event? can you share html created. not razor syntax – Savan S Jun 07 '18 at 07:33
want to disable being able to click on it. and what do you mean? this is the syntax – shanizoe Jun 07 '18 at 07:35
Updated my answer. Check now. I have tested it. working fine – Savan S Jun 07 '18 at 07:59
So you want something like this?-> first time on click of actionlink it should redirect. After that everytime onclick it should not redirect and behave like disabled button.. – Savan S Jun 07 '18 at 08:15
Yes, I want the button to not be clickable after that – shanizoe Jun 07 '18 at 08:29
remove return false from disable function. It will allow to click on first time. Updating my answer – Savan S Jun 07 '18 at 10:21

score 0 · Answer 2 · answered Jun 07 '18 at 07:04

To explain the problem, when you click on the button, your javascript code executes and then your action link sends the page and in the new page the button is not disabled.

You can try this in your javascript method :

function disable() {
document.getElementById("cancel").disabled = true;
document.getElementById("ok").disabled = true;

return false;
}

and in your html :

@Html.ActionLink("Yes", "RemoveHandler", new { path = x }, new { onclick = "return disable()" })

The program never enters the function so this wont help yet – shanizoe Jun 07 '18 at 07:31 — shanizoe, Jun 07 '18 at 07:31

Actionlink and button disabled when pressed

2 Answers2