Menu
Inside the GetSelected function, first the HTML Table is referenced and then all the CheckBoxes inside it are referenced. Then a loop is executed over the referenced CheckBoxes and inside the loop the value of the selected (checked) CheckBox is inserted into an Array.
Using jQuery, we first set an onclick event on the button after the document is loaded. In the onclick event, we created a function in which we first declared an array named arr. After that, we used a query selector to select all the selected checkboxes. Finally, we print all the vales in an alert box.
If you want to get checked checkboxes from a particular checkbox group, depending on your choice which button you have clicked, you can use $('input[name=”hobbies”]:checked') or $('input[name=”country”]:checked'). This will sure that the checked checkboxes from only the hobbies or country checkbox group are selected.
To link several checkboxes together to make them into an array in the PHP $_POST array you need to make all of the checkboxes have the same name, and each name must end in "[]". When both of the checkboxes are filled and the form is submitted this produces the following array.
Call .get() at the very end to turn the resulting jQuery object into a true array.
$("#merge_button").click(function(event){
event.preventDefault();
var searchIDs = $("#find-table input:checkbox:checked").map(function(){
return $(this).val();
}).get(); // <----
console.log(searchIDs);
});
Per the documentation:
As the return value is a jQuery object, which contains an array, it's very common to call .get() on the result to work with a basic array.
DEMO: http://jsfiddle.net/PBhHK/
$(document).ready(function(){
var searchIDs = $('input:checked').map(function(){
return $(this).val();
});
console.log(searchIDs.get());
});
Just call get() and you'll have your array as it is written in the specs: http://api.jquery.com/map/
$(':checkbox').map(function() {
return this.id;
}).get().join();
You need to add .toArray() to the end of your .map() function
$("#merge_button").click(function(event){
event.preventDefault();
var searchIDs = $("#find-table input:checkbox:checked").map(function(){
return $(this).val();
}).toArray();
console.log(searchIDs);
});
Demo: http://jsfiddle.net/sZQtL/
I refactored your code a bit and believe I came with the solution for which you were looking. Basically instead of setting searchIDs to be the result of the .map() I just pushed the values into an array.
$("#merge_button").click(function(event){
event.preventDefault();
var searchIDs = [];
$("#find-table input:checkbox:checked").map(function(){
searchIDs.push($(this).val());
});
console.log(searchIDs);
});
I created a fiddle with the code running.
var ids = [];
$('input[id="find-table"]:checked').each(function() {
ids.push(this.value);
});
This one worked for me!
var idsArr = [];
$('#tableID').find('input[type=checkbox]:checked').each(function() {
idsArr .push(this.value);
});
console.log(idsArr);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With