I have several input text element,

I have button disable some input for disable some input element(s),

I have also button see values, for see all input values,

What I need: for example I click on button disable some input, now some inputs are disabled right?

and now if click on button see values, I want see only that input values, which are not disabled.

I make almost all, but I dont know, how make this condition: if element already is disabled

please see demo /

The body is:

<form>
      <ul id="my_ul">
             <li><input type="text" value="a" /></li>
             <li><input type="text"  value="s" /></li>
             <li><input type="text" value="d" /></li>
       </ul>
</form>

<div id="disable_btn">disable some input</div>
<div id="see_values">see values</div>

The js, using jQuery 1.8.2

$(document).ready( function () {  

        $("#disable_btn").on("click", function () {
            $("#my_ul li:eq(0) input").prop("disabled", true);
        });


        $("#see_values").on("click", function () {
            $("#my_ul li").each ( function () {
                if (1==1/*if this input is not disabled*/) {
                    alert ( $(this).find("input").val()  );
                }
            });
        });
});

​

I have several input text element,

I have button disable some input for disable some input element(s),

I have also button see values, for see all input values,

What I need: for example I click on button disable some input, now some inputs are disabled right?

and now if click on button see values, I want see only that input values, which are not disabled.

I make almost all, but I dont know, how make this condition: if element already is disabled

please see demo http://jsfiddle/WW8UF/4/

The body is:

<form>
      <ul id="my_ul">
             <li><input type="text" value="a" /></li>
             <li><input type="text"  value="s" /></li>
             <li><input type="text" value="d" /></li>
       </ul>
</form>

<div id="disable_btn">disable some input</div>
<div id="see_values">see values</div>

The js, using jQuery 1.8.2

$(document).ready( function () {  

        $("#disable_btn").on("click", function () {
            $("#my_ul li:eq(0) input").prop("disabled", true);
        });


        $("#see_values").on("click", function () {
            $("#my_ul li").each ( function () {
                if (1==1/*if this input is not disabled*/) {
                    alert ( $(this).find("input").val()  );
                }
            });
        });
});

​

• javascript
• jquery
• html

• 2 See working jsfiddle jsfiddle/WW8UF/6 – A. Wolff Commented Nov 7, 2012 at 10:50

6 Answers 6

No need to loop over every li, just get the inputs which are not disabled:

$("#my_ul li input:not([disabled])").each ( function () { ... });

Live example: http://jsfiddle/WW8UF/10/

You could also use

$("#my_ul li input:enabled").each ( function () { ... });

Which is a bit cleaner. Live example: http://jsfiddle/WW8UF/11/

The condition is:

!$(this).find('input').attr('disabled')

Here is yet another try:

$("#see_values").on("cick", function () {
        $("#my_ul li input").not(":disabled").each ( function ()
                alert ( $(this).val());

        });

    });

JQuery provides the pseudo-selector ":disabled", so you just ignore those.

Hope that helps!

Use a better selector.

Change:-

$("#my_ul li").each ( function () {
  if (1==1/*if this input is not disabled*/) {
    alert ( $(this).find("input").val()  );
  }          
});

to:-

// Perform search with selector
$("#my_ul li input:enabled").each ( function () {
  // No if statement required
  alert ( $(this).find("input").val()  );          
});

An other possibility:

$(document).ready( function () {  

        $("#disable_btn").on("click", function () {
            $("#my_ul li:eq(0) input").prop("disabled", true);
        });


        $("#see_values").on("click", function () {
            $("#my_ul li input").each ( function () {
                if (!$(this).is(':disabled')) { //or if ($(this).is(':enabled'))
                    alert ( $(this).val()  );
                }

            });

        });

});

Working jsfiddle

Just check your disabled property value, in the same way that you have assigned it, like this:

if (!$(this).find("input").prop("disabled")) {
     // do something to this
}