если поменять ("form") на, например, ("div") , то все отрабатывает отлично.
$(".admin-panel_change-roles").click(function (e){
e.preventDefault();
console.log($(this).closest("form"))
$.ajax({
url: '/admin-panel/change-roles',
method: 'POST',
data: $(this).closest(".admin-panel_users-roles").serialize(),
success: function (data) {
console.log(data)
}
})
})
<form class="admin-panel_users-roles" method="post">
<div class="modal-body">
<?php foreach ($data['roles'] as $role):?>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="<?php echo $role['alias'] ?>" value="<?php echo $role['id'] ?>" id="flexCheckDefault" <?php echo in_array($role['id'], explode(',', $data['user']->roles_id)) ? 'checked' : '' ?>>
<label class="form-check-label" for="flexCheckDefault">
<?php echo $role['name'] ?>
</label>
</div>
<?php endforeach; ?>
<input type="hidden" name="user_id" value="<?php echo $data['user']->id ?>">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary admin-panel_change-roles" data-bs-dismiss="modal">Изменить</button>
</div>
</form>