开发者

Jquery .each not working, bad code or a better method available?

开发者 https://www.devze.com 2023-03-20 01:07 出处:网络
First the setup: jquery 1.5.1 Firefox 4.0 Goal: I\'ve got a bunch of textboxes that are enabled/disabled using checkboxes.If a textbox is enabled, I want it to have a value greater than zero.

First the setup: jquery 1.5.1 Firefox 4.0

Goal: I've got a bunch of textboxes that are enabled/disabled using checkboxes. If a textbox is enabled, I want it to have a value greater than zero.

HTML for one of the boxes(there are a variable number of them on the page):

<input type="text" value="0" name="RequestList[4].iCount" id="RequestList_4__iCount" class="num-box">

My jQuery using .each that doesn't work:

var oneFill = false;
$('.num-box').each(function() {
    var myItem = $(this);
    if (myItem.attr('disabled') == false) {
        if (myItem.val() > 0) {
            oneFill = true;
        }
    }
});
if (!oneFill) {

When I trace the above code in Firebug, it doesn't do anything. It continues to the next line of code(if(!oneFill)).

When I use $('.num-box') in Firebug, it returns a complete list of all textboxes. So I'm very confident that I've got the right selector.

So the question is, what did I do wrong? I've looked at a host of examples here and it appears my use of .each was correct.

But, is there a more efficient method for checking all enabled textboxes with class of num-box?

Addition1 @artlung Using continuing my sample html above, I would have at least the following:

<input type="text" value="0" name="RequestList[1].iCount" id="RequestList_1__iCount" class="num-box">
<input type="text" value="0" name="RequestList[2].iCount" id="RequestList_2__iCount" class="num-box">
<input type="text" value="0" name="RequestList[3].iCount" id="RequestList_3__iCount" class="num-box">
<input type="text" value="0" name="RequestList[4].iCount" id="RequestList_4__iCount" class="num-box">

The checkboxes would look like:

<input type="checkbox" value="true" name="RDEquipListItem[1]" id="RDEquipListItem_1_">
<input type="checkbox" value="true" name="RDEquipListItem[2]" id="RDEquipListItem_2_">
<input type="checkbox" value="true" name="RDEquipListItem[3]" id="RDEquipListItem_3_">
<input type="checkbox" value="true" name="RDEquipListItem[4]" id="RDEquipListItem_4_">

I've got java script that enables/disables the textboxes when the appropriate checkbox is checked.

So far, I've seen some good adjustments to the meat of my code. I will vote for those tomorrow.

My confusion is whether there is an issue with my .each portion:

$('.num-box').each(function() {

Addition2 I've been playing with some of the results. My current code looks like:

var oneFill = false;
var myEnabled = $('.num-box:enabled');
myEnabled.each(function() {
    var myItem = $(this);
    if (parseInt(myItem.val()) > 0) {
        oneFill = true;
    }
});
if (!oneFill) {

myEnabled gets the correct list of elements that are enabled. thumbs up

However, the myEnabled.each does nothing.

Is there an issue with a single item being used by .each?

Final comment Not sure why this was giving me an issue but I had to reorder the logic a bit. Even using Firebug, it wouldn't step into the ".each" code but the results are correct.

Final code(NOTE: .num-box are textboxes that are enabled/disabled by checkboxes):

//make sure one item has been filled in and all are greater than zero
var allFilled = true;
var myEnabled = $('.num-box:enabled');
//check that we have at least one item checked out
if (myEnabled.length == 0) {
    alert("At least one needs to be filled.");
    return false;
}

$.each(myEnabled, function() {
    var myItem = $(this);
    if (parseInt(myItem.val()) <= 0) {
        allFilled = false;
    }
});
if (!allFilled)
{
    //go d开发者_如何转开发o something


I think you need to check whether or not the current num-box is disabled by doing the following...

myItem.is(':disabled')

EDIT

could you accomplish what you want to do without using the .each?

something like... http://jsfiddle.net/fWCxj/2/

HTML    

<input type="checkbox" value="true" name="RDEquipListItem[2]" id="RDEquipListItem_2_">&nbsp;&nbsp;&nbsp;
<input type="text" value="0" name="RequestList[2].iCount" id="RequestList_2__iCount" class="num-box" disabled="disabled">
<br />

<input type="checkbox" value="true" name="RDEquipListItem[3]" id="RDEquipListItem_3_">&nbsp;&nbsp;&nbsp;
<input type="text" value="0" name="RequestList[3].iCount" id="RequestList_3__iCount" class="num-box" disabled="disabled">
<br />

<input type="checkbox" value="true" name="RDEquipListItem[4]" id="RDEquipListItem_4_">&nbsp;&nbsp;&nbsp;
<input type="text" value="0" name="RequestList[4].iCount" id="RequestList_4__iCount" class="num-box" disabled="disabled">
<br />

JS

$('input[type=checkbox]').click(function() {
    var cb = $(this);
    cb.next('input[type=text]').prop('disabled', cb.is(':not(:checked)'));
});

var oneFill = $('.num-box:not(:disabled)').length > 0;
alert(oneFill);


Try this

var oneFill = false;
$('.num-box').each(function() {
    var myItem = $(this);
    if (myItem.is(":enabled") && parseInt(myItem.val()) > 0) {
            oneFill = true;

    }
});
if (!oneFill) {
}


.attr() returns a string, not a boolean character. if you want to check to see if an input is disabled or not, use .is(':disabled')

0

精彩评论

暂无评论...
验证码 换一张
取 消