5

I am trying to get some jQuery to disable the confirm button on my form if the dropdown list is a certain value, but it doesnt seem to be working.

I have read lots of posts on here and tried various different ways.

Here is my code at the moment:

    <script>
       $(document).ready(function () {
       // Handler for .ready() called.
       $('#MoveToCompanyId').attr("disabled", true);

       $('#DeleteAll').live("click", function () {

           if ($(this).attr("value") == "True") {
                 $('#MoveToCompanyId').attr("disabled", true);
           } else {
                 $('#MoveToCompanyId').attr("disabled", false);
                 $('#confirm').attr("disabled", true);
                 $('#MoveToCompanyId').change(function () {
                     if ($("#MoveToCompanyId option:selected").text() != "---Select Company---") {
                    $('#confirm').removeAttr("disabled");
                    alert($("#MoveToCompanyId option:selected").text());
                }
                else {
                    $('#confirm').attr("disabled", true);
                    alert("I should be disabled!");
                }

            });
        }
        });
     });

    </script>

Can anyone see any problems with it?

Just to clarify, i know it gets into the correct code blocks as my alerts are working. Its just the button disabling that is not working.

Kind Regards,

Gareth

Improve this question
6
  • Try .prop instead of .attr. Commented Jun 14, 2012 at 13:20
  • Unfortunately this didnt work either. I am looking at the button in Firebug and it never seems to add the disabled attribute at all. Commented Jun 14, 2012 at 13:28
  • @BehnamEsmaili not easily as its calling loads of clever functions from MVC framework. Commented Jun 14, 2012 at 13:32
  • @GazWinter have you checked for other attribute ? (e.g: .attr("someproperty","somevalue")). Commented Jun 14, 2012 at 13:35
  • @GazWinter can you post a section of the html that goes with the function? Commented Jun 14, 2012 at 13:44

3 Answers 3

Reset to default
10

You should be using 

prop('disabled',true)
prop('disabled',false)

if you are using jQuery 1.6+ then you should be using prop.

Read more about prop

Properties generally affect the dynamic state of a DOM element without changing the serialized HTML attribute. Examples include the value property of input elements, the disabled property of inputs and buttons, or the checked property of a checkbox. The .prop() method should be used to set disabled and checked instead of the .attr() method. The .val() method should be used for getting and setting value.

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

6 Comments

thanks for that advice wirey, sadly this doesnt seem to work either.
@janex Do you have an example of what you're trying to do?
Disregard my comment, it put the disabled prop in the button just fine, but my button is still clickable. I didn't think I had to check if the disabled prop was on or not on the button before letting the code continue. I thought disabled actually disabled all events for that button. My bad. Thanks for the help!
@janex are you using jQuery UI buttons? If so that's a different story, but with regular buttons it should prevent clicks if they are disabled
no i'm using regular buttons but with custom css, but i'm listening to the touchstart event not click event, since its for a phonegap app @ᾠῗᵲᄐᶌ, i see the disabled added to the button but touch events are still happening.
|
3

You should be using

.attr('disabled', 'disabled')

to disable a control and

.removeAttr('disabled')

to enable it.

http://www.w3schools.com/tags/att_input_disabled.asp

Improve this answer

5 Comments

Thanks Dave, this is one of the things i already tried to no avail!
@BehnamEsmaili specifying an arbitrary value for 'disabled' will disable a control but the only way to re-enable it is to remove the 'disabled' attribute altogether
what is your problem with removing it then?
Thanks for all your help guys, i got it working using the .prop way.
@BehnamEsmaili no problem at all; the point is that if you leave the 'disabled' attribute on a control it should always be disabled (though some browsers maybe behave differently) as 'disabled', like 'checked', 'selected' and 'nowrap' are boolean attributes; their value doesn't matter except for XML conformance
0

Try

 attr('disabled', 'disabled')

instead of 

attr("disabled", true);
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.