Get value checkbox and push in array

Question

Can you help me on how to get the checkbox values to be a data array? I code like this, and don't get any output. Thanks for helping me.

In my html :

<input class="form-check-input delete-checkbox" type="checkbox" name="checkbox[]" id="checkbox" value="{{ $item->id }}"data-id="{{ $item->id }}">

In my JS:

function multiple_delete(id) {
  const selected = [];
  $(".form-check input[type=checkbox]:checked").each(function () {
    selected.push(this.value);
  });
  if (selected.length > 0) {
    dataid = selected.join(",");
    $.ajax({
      url: "multiple-delete",
      type: "POST",
      data: +dataid,
      success: function (data) {
        if (data["success"]) {
          alert(data["success"]);
        } else {
          alert(data["error"]);
          console.log(data);
        }
      },
      error: function (data) {
        alert(data.responseText);
      },
    });
  }
}

My output :

Answer 1

First, you are using the wrong selector. You should change .form-check in the javascript to .form-check-input or .delete-checkbox. Also you can easily get values of the selected checkboxes using jquery's .map() method.

Change your javascript code to something like this

function multiple_delete(id) {
    const selected = $(".delete-checkbox:checked").map((i, el) => el.value).get();

    if (selected.length > 0) {
        $.ajax({
            url: "multiple-delete",
            type: "POST",
            data: selected.join(","),
            success: function (data) {
                if (data["success"]) {
                    alert(data["success"]);
                } else {
                    alert(data["error"]);
                    console.log(data);
                }
            },
            error: function (data) {
                alert(data.responseText);
            },
        });
    }
}