Create a dynamic checkbox value (value) using ajax

Question

I have an ajax code http://jsfiddle.net/rubensoul/dcb14q79/ and I need the values that appear to be dynamic, example:

In the link I put has 3 inputs and in js I created for only 1, if I put for everyone it would send normally

    checkbox:$($("#checkbox input")[0]).prop("checked")?$($("#checkbox input")[0]).val():'',

Except that I need these values to be dynamic, that is, I do not need to put 1 by 1. I would put only 1. that it would assign the value of each input automatically without having to touch this code again.

It’s possible and how I can fix it?

I stand by

Answer 1

From your HTML you get the idea that all inputs are descended from this div #checkbox.

So you can use the .find() to find the inputs and then using the .filter() and the .map() create an array of values that are checked. Then you can send this as JSON in AJAX. I also used .get() jQuery to give me a native array and only work with native Javascript from there.

Something like that:

$('#checkbox').on('click', function () {
    var checkboxes = $(this).find('input[name="checkbox[]"]').get().filter(function (input) {
        return input.checked;
    }).map(function (input) {
        return input.value;
    });
    $.ajax({
        type: "POST",
        url: "teste4.php",

        data: {
            checkbox: JSON.stringify(checkboxes),
            profissional: $("#profissional").val()
        },