javascript .push method inside .each loop only returning one array

Question

Im trying iterate over the checkbox groups and if each group has at least one box checked, I want to add that product information to an array(upperOrder). The problem with my code is that it's only adding the last checked checkbox group (or over writing the previous added group).

Basically I want a multidimensional array with the main array being upperOrder and the sub arrays being each product's information.

Thanks and appreciate anyone's help or if there is a better method to accomplishing this, I would appreciate any suggestions!

html:

<form class="upperCheckboxForm" data-prodid="100" data-prodname="adams" id="group1">
<fieldset data-role="controlgroup">
    <legend>Group 1:</legend>
    <input type="checkbox" name="checkbox-v-2a" id="checkbox-v-2a" value="one" data-tooth-position="UR1">
    <label for="checkbox-v-2a">One</label>
    <input type="checkbox" name="checkbox-v-2b" id="checkbox-v-2b" value="two" data-tooth-position="UR2">
    <label for="checkbox-v-2b">Two</label>
    <input type="checkbox" name="checkbox-v-2c" id="checkbox-v-2c" value="three" data-tooth-position="UR3">
    <label for="checkbox-v-2c">Three</label>
</fieldset>
</form>

<form class="upperCheckboxForm" data-prodid="101" data-prodname="lap" id="group2">
<fieldset data-role="controlgroup">
    <legend>Group 2:</legend>
    <input type="checkbox" name="checkbox-v-2a" id="checkbox-v-2a" value="four" data-tooth-position="UR4">
    <label for="checkbox-v-2a">Four</label>
    <input type="checkbox" name="checkbox-v-2b" id="checkbox-v-2b" value="five" data-tooth-position="UR5">
    <label for="checkbox-v-2b">Five</label>
    <input type="checkbox" name="checkbox-v-2c" id="checkbox-v-2c" value="six" data-tooth-position="UR6">
    <label for="checkbox-v-2c">Six</label>
</fieldset>
</form>

<button id="submitPrintForm">Click</button>

jquery:

$('#submitPrintForm').on('click', function() {

var upperOrder      = [];

$('.upperCheckboxForm').each(function() {

    var $prodName           = $(this).data('prodname'),
        $prodId         = $(this).data('prodid'),
        $prodUrl            = $(this).attr('id'),
        $prodPosition       = [];

    $('#'+ $prodUrl +' input:checked').each(function() {
      $prodPosition.push($(this).data('tooth-position'));
    })

    if($prodPosition.length > 0) {
        upperOrder.push = ([$prodName, $prodId, $prodPosition.length, $prodPosition]);
    }
})
console.log(upperOrder);
});

@MattBall The product has two parts, upperOrder and lowerOrder and I need to be able to distinguish between the two. Is that what you were asking? — Adam
– Adam, Commented Jul 5, 2013 at 15:47
developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… — manraj82
– manraj82, Commented Jul 5, 2013 at 15:50

Reason · Accepted Answer · 2013-07-05 15:46:59Z

5

push is a method. Call it like this:

upperOrder.push([$prodName, $prodId, $prodPosition.length, $prodPosition])

when you are assigning something to upperOrder.push you are actually overwriting the method push, which will make subsequent calls to it fail.

answered Jul 5, 2013 at 15:46

Reason

1,43012 silver badges34 bronze badges

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

2 Comments

Adam Over a year ago

Im still only getting the last checked group.

Adam Over a year ago

I apologize, 2 hours later I realized that I needed to omit the '=' sign. Thank you for your answer, I must of had a complete brain shut down!

manraj82 · Accepted Answer · 2013-07-05 16:28:24Z

0

Is this what yyou were lookin for?

$('#submitPrintForm').on('click', function() {

var upperOrder      = [];

$('.upperCheckboxForm').each(function() {

    var $prodName           = $(this).data('prodname'),
        $prodId         = $(this).data('prodid'),
        $prodUrl            = $(this).attr('id'),
        $prodPosition       = [];

    $('input:checked', this).each(function() {
      $prodPosition.push($(this).data('tooth-position'));
    })


    if($prodPosition.length > 0) {
        upperOrder.push($prodName, $prodId, $prodPosition.length, $prodPosition);
    }
})

    console.log(upperOrder);

});

answered Jul 5, 2013 at 16:28

manraj82

6,40525 gold badges59 silver badges85 bronze badges

1 Comment

Adam Over a year ago

No, I'm getting the information correctly, but it's only returning one array, when there should be two in this example. But when I move the upperOrder array within the .upperCheckboxForm .each loop it returns the two arrays I was looking for. But Im not sure why the my original code does not work as I expected it too.

Collectives™ on Stack Overflow

javascript .push method inside .each loop only returning one array

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related