Javascript function that return an array of values

Question

this function read the current selected values from a table, I can't get the list of them in a single array readable outside this function.

function getcheckboxed() {
vartoberead = [];
$("input:checkbox[name=test]:checked").each(function(){
 vartoberead [vartoberead .length] = $(this).val();
 console.log($(this).val(), vartoberead);
 return vartoberead;
});

I've declared vartoberead, both inside, than outside the function, tried with:

var myoutsidevar = getcheckboxed();

but always return

[undefined]

Every help is appreciated

• micah: Side note. Instead of manually supplying the index you can use this syntax- vartoberead.push($(this).val());

Answer 1

You can shorten this up a bit:

var values = $("input:checkbox[name=test]:checked").map(function() {
 return this.value;
}).get();

Edit: To make this a function and return:

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

• Curtis: What does get() do in this instance?
• tymeJV: .get() creates the basic Array @Curt -- else it'll be a jQuery object.
• user2239318: this run fine outside a function, is there a way to put it inside a function? if I do: function getcheckboxed() { var levalues = $("input:checkbox[name=dalinkare]:checked").map(function() { return this.value; }).get(); return levalues;}
• tymeJV: @user2239318 -- Yeah, that'll work - ill update the answer to include it in a function.
• tymeJV: @user2239318 -- Edited the answer

Answer 2

You can use map:

var vartoberead = $("input:checkbox[name=test]:checked").map(function(){
 return $(this).val();
});

map() does actually return something, so you don't need to push to an array but instead just let jQuery fill the array for you with the returned values.

Answer 3

you should return after the each() cycle (and not inside the cycle as you're doing) anyway you could also use serializeArray

function getcheckboxed() {
 return $("input:checkbox[name=test]:checked").serializeArray();
};

Answer 4

When you print the value inside de each ( console.log($(this).val(), vartoberead); ) it show the values correctly ?

Other thing is that you are returning the value inside the each.

Try this:

function getcheckboxed() {
 vartoberead = [];
 $("input:checkbox[name=test]:checked").each(function(){
 vartoberead.push($(this).val());
 });
 return vartoberead;
}

Answer 5

I have a pure javascript solution for this . I have used html array i.e all checkboxes having same name (say test[])

function getCheckBoxesValues()
{
	var values=[];
 for(var i=0;i<document.getElementsByName('test[]').length;i++)
 
 {
 if((document.getElementsByName('test[]')[i]).checked)
							{
								values.push((document.getElementsByName('test[]')[i]).value);
							}
 }
	return values;			
}

<input type="checkbox" name="test[]" value="c1"/>
<input type="checkbox" name="test[]" value="c2"/>
<input type="checkbox" name="test[]" value="c3"/>
<input type="checkbox" name="test[]" value="c4"/>
<input type="checkbox" name="test[]" value="c5"/>
<button onClick="alert(getCheckBoxesValues());">Result</button>

Answer 6

You have to modify you code to valid JavaScript code. That is: vartoberead [vartoberead .length] should be vartoberead[vartoberead.length] without any spaces. Beside this issue everything else is ok with your code.

Just by looking at your code I would rather use vartoberead.push($(this).val()) to add to the returned array than looking at the arrays length.