Array inside an array during javascript processing

Question

I am trying to process a form using Ajax and have been having a problem with processing check boxes. I thought I could do an array inside an array which would add the checked boxes to the data object but that doesn't seem to be working. It doesn't show up as a part of the object in the console or anything like that. I tried a few variations and nothing was working. This is what it looks like currently:

var formData = {
        'fname' : $('input[name=fname]').val(),
        'lname' : $('input[name=lname]').val(),
        'phone' : $('input[name=phone]').val(),
        'email' : $('input[name=email]').val(),
        'sqft'  : $('select[name=sqft]').val(),

        'checked': $('input[name=services[]]:checked').each(function(){
            checked.push($(this).val());
        });
    };

I know I could use serialize() but honestly I am simply not familiar with processing data from that method. Since I need to process the data with PHP I wanted to stick with what I know.

This is the markup for the checkboxes:

<div class="checks span6">
 <p>Check which services you are interested in:</p><br>

 <input type="checkbox" name="services[]" value="janitorial"><p>Janitorial</p><br>
 <input type="checkbox" name="services[]" value="window"><p>Window cleaning</p><br>
 <input type="checkbox" name="services[]" value="carpet"><p>Carpet service</p><br>
 <input type="checkbox" name="services[]" value="restroom"><p>Restroom sanitation</p><br>
 <input type="checkbox" name="services[]" value="facility"><p>Facility Maintenance</p><br>
 <input type="checkbox" name="services[]" value="floors"><p>Floor strippin &amp; re-waxing</p><br>
 <input type="checkbox" name="services[]" value="moving"><p>Move in or move out</p><br>
 <input type="checkbox" name="services[]" value="other"><p>Other</p><br>
</div>

@eignhpants should be fairly straightforward in PHP, depending on the form method, could just be $_POST['services'] should contain the selected checkboxes in a form of array, if you use ajax to transport it to PHP, the answer below if correct. +1 — Kevin
– Kevin, Commented Sep 28, 2014 at 2:26
@Ghost the issue was ajax and the below post solved it thank you. — eignhpants
– eignhpants, Commented Sep 28, 2014 at 2:31

Ram · Accepted Answer · 2014-09-28 02:23:22Z

1

Currently there is a syntax error in the posted code, extra ; after closing ) for the each method. You should also escape the [] part of the name attribute's value or wrap it with quotes in your selector. Apart from that you are storing a jQuery object instead of an array of selected values. You can use the map method.

    'checked': $('input[name="services[]"]:checked').map(function(){
        return this.value;
    }).get()

edited Sep 28, 2014 at 2:23

answered Sep 28, 2014 at 2:17

Ram

145k16 gold badges174 silver badges201 bronze badges

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

1 Comment

eignhpants Over a year ago

this worked, thanks a lot. i wasn't aware of the .map function. as usual i probably should have check the documentation better.

PeterKA · Accepted Answer · 2014-09-28 03:04:39Z

0

If you're open to learning new ideas, here's how you could use .serialize() -- very straight forward and nothing on the server-side (PHP) needs to be changed:

 var formData = $('form').serialize(); //THAT's it!!

In your case this would produce the following query string -- already URL encoded -- which is what your current data would converted to before POSTing:

services%5B%5D=janitorial&services%5B%5D=window&services%5B%5D=carpet&services%5B%5D=restroom&services%5B%5D=facility

answered Sep 28, 2014 at 3:04

PeterKA

24.7k5 gold badges28 silver badges52 bronze badges

1 Comment

eignhpants Over a year ago

do i need to parse it in any special way?

Collectives™ on Stack Overflow

Array inside an array during javascript processing

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related