bcesars
bcesars

Reputation: 1010

jQuery attribute disable not working

I'm try to disable (and remove) some attributes in jQuery, but it seems not working when value is changed and set to "disabled" some fields. This script runs when a value of drop-down box is changed.

Here code below:

$(".tipo_frete").change(function(){
    if($(this).val()  == "FOB" ){
        $(".id_transp").attr("disabled");
        $(".id_transp").val("");
        $(".nome_transp").attr("disabled");
        $(".nome_transp").val("");
        $(".valor_frete").attr("disabled");                     
        $(".valor_frete").val("");                      
    }else{
        $(".id_transp").removeAttr("disabled");
        $(".valor_frete").removeAttr("disabled");           
        $(".nome_transp").removeAttr("disabled");           
    }
});

Did I do something wrong here?

Upvotes: 1

Views: 104

Answers (4)

Alireza MH
Alireza MH

Reputation: 593

In jQuery when you want to get attribute value, must be use .attr('key') or .prop('key') with one argument, But when you want to set a value to an attribute, you must set two arguments like as .attr('key', 'value') or .prop('key', 'value')

$(".id_transp").attr("disabled", "disabled");

//OR

$(".id_transp").prop("disabled", true);

Upvotes: 2

Balachandran
Balachandran

Reputation: 9637

use prop()

disable

$(".id_transp").prop("disabled",true);

enable

$(".id_transp").prop("disabled",false);

NOTE : $(".id_transp").attr("disabled"); you have to pass 2 arguments like $(".id_transp").attr("disabled",true)

simplify your code

$(".tipo_frete").change(function () {
    if ($(this).val() == "FOB") {
        $(".id_transp,.nome_transp,.valor_frete").val("").prop("disabled", true);
    } else {
        $(".id_transp,.nome_transp,.valor_frete").prop("disabled", false);
    }
});

Upvotes: 3

user4366164
user4366164

Reputation:

Yes, you are missing another parameter in attr() property.
Try this:

$(".tipo_frete").change(function(){
    if($(this).val()  == "FOB" ){
        $(".id_transp").attr("disabled","disabled");
        $(".id_transp").val("");
        $(".nome_transp").attr("disabled","disabled");
        $(".nome_transp").val("");
        $(".valor_frete").attr("disabled","disabled");                      
        $(".valor_frete").val("");                      
    }else{
        $(".id_transp").removeAttr("disabled");
        $(".valor_frete").removeAttr("disabled");           
        $(".nome_transp").removeAttr("disabled");           
    }
});

But when you remove those attibutes, you keep only one parameter inside and it will be removed.

Upvotes: 2

I'm Geeker
I'm Geeker

Reputation: 4637

element equal to selector '.id_transp';

  var $element = $(...);
        $element.prop('disabled', true);
        $element.attr('disabled', true); 

        // The following do not require jQuery
        $element.get(0).disabled = true;
        $element.get(0).setAttribute('disabled', true);
        $element[0].disabled = true;
        $element[0].setAttribute('disabled', true);

Upvotes: 1

Related Questions