1

I have an index page where I have a Create Button. On click of the create button it opens a new view called CreateStudent View where i have multiple bootstrapp tabs. Each tab contails a button on it. Index view : Button

<div class="row">
    <div class="col-md-6 text-right"><a class="btn btn-default CreateMe" href="/MyProject/StaffCreate" role="button">Create New</a></div>
</div>

And the CreateStudent View has a button LogOnAdd on one of the tab:

<div class="row">
    <div class="col-md-8 text-right">
        <a class="btn btn-default LogonAdd" id="LogonAdd" href="#" role="button">Add </a>
    </div>
</div>

Using the below jquery I an trying to disable the LogOnAdd button. 

$('.CreateMe').click(function () {
    $(".LogonAdd").attr("disabled", true);
});

But the above jquery code is not working. The button is not getting disabled. Can some body guide me what mistake I have made in the jquery.

I am using vs 2010 and mvc4 .

I doubt whether it is failing to find the control.

Improve this question
2
  • Try to take a look here, the question seems similar to yours. Commented Mar 7, 2016 at 15:02
  • Not a duplicate as it talks about button on same page Commented Mar 8, 2016 at 12:04

2 Answers 2

Reset to default
2

Try this, add a class to your anchor tag when you want to disable it, and in css you can set the mouse events to do nothing on it, Here

$('.CreateMe').click(function () {
    $('.LogonAdd').addClass('disabledLink');
});

And CSS

a.disabledLink {
  pointer-events: none;
}

To enable the link again just remove the class.

$('.LogonAdd').removeClass('disabledLink');

Edit 1: Since you said you have to disable a button which is another view but handle the disabling stuff in current view you can do this, Set a variable to say if the button has to be disabled or not, on page load of the second view run the jquery script to check this value and toggle the link state. Here's a code snippet

$('.CreateMe').click(function () {
  localStorage.setItem('disableLogOnAdd', true); //set
});

On the document ready event of the second page do this,

if(localStorage.getItem('disableLogOnAdd')){
  $('.LogonAdd').addClass('disabledLink');
}

Note, Keep the css rule to remove the pointer events as mentioned above.

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

7 Comments

anchor isn't input, disabled boolean attribute has no effect on it
tried. but not working in my case. Please note the CreateMe button in index page and the button which i need to disable is in another page. Is that the problem?
@jubi check my updated answer.
tried, but no luck . As zakaria mentioned JS can just deal with current DOM and not other pages DOM.the button i wanna disable is in another page. so according to him it is not possible. can you suggest a work around for that
@jubi updated my answer, have a check
|
2

The disabled attribute work just on <input> tags. you could not use it with anchor it will make no effect.

Since you're using bootstrap the disabled attribute will works on anchor with role='button' it should be true :

$('.LogonAdd').attr("disabled","true"); 
//OR
$('.LogonAdd').attr("disabled","disabled");

NOTE : That will not work in your current context since you're trying to disable an element that is not in the current page.

So if i'm realy understanding the other buttons are in the same page just in different tabs. if this is the case you could disable the buttons in other tabs by default (in html code), then enable them when you click in the save button in first tab.

Improve this answer

7 Comments

Still it is enabled.
anchor isn't input, disabled boolean attribute has no effect on it
Am i finding the button in right way.
tried $('.LogonAdd').attr("disabled","disabled"); but not working
need to disable is in another page. @jubi that not possible and that is the problem, JS can just deal with current DOM and not other pages DOM.
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.