76 lines
2.4 KiB
JavaScript
76 lines
2.4 KiB
JavaScript
$(document).ready(function() {
|
|
// Initialize Select2 for user selection
|
|
$('.select2').select2({
|
|
theme: 'bootstrap-5',
|
|
width: '100%'
|
|
});
|
|
|
|
// Handle member removal
|
|
$(document).on('click', '.btn-remove-member', function() {
|
|
const memberRow = $(this).closest('.member-row');
|
|
memberRow.remove();
|
|
});
|
|
|
|
// Handle adding new member
|
|
$('#addMemberBtn').on('click', function() {
|
|
const select = $('#user_id');
|
|
const selectedOption = select.find('option:selected');
|
|
const selectedValue = select.val();
|
|
|
|
if (!selectedValue) {
|
|
return;
|
|
}
|
|
|
|
const userId = selectedValue;
|
|
const userName = selectedOption.text();
|
|
const userEmail = selectedOption.data('email');
|
|
const userAvatar = selectedOption.data('avatar');
|
|
|
|
// Check if user is already in the list
|
|
if ($(`.member-row[data-user-id="${userId}"]`).length > 0) {
|
|
return;
|
|
}
|
|
|
|
// Create new member row
|
|
const memberRow = `
|
|
<div class="list-group-item d-flex align-items-center member-row" data-user-id="${userId}">
|
|
<img class="member-avatar" src="${userAvatar}">
|
|
<div class="flex-grow-1">
|
|
<div class="fw-bold">${userName}</div>
|
|
<div class="text-muted small">${userEmail}</div>
|
|
</div>
|
|
<button type="button" class="btn btn-remove-member ms-2">
|
|
<i class="fas fa-user-minus me-1"></i>Remove
|
|
</button>
|
|
</div>
|
|
`;
|
|
|
|
// Add to the list
|
|
$('#selectedMembersList').append(memberRow);
|
|
|
|
// Clear the select and trigger change event
|
|
select.val(null).trigger('change');
|
|
});
|
|
|
|
// Handle form submission
|
|
$('#membersForm').on('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
// Collect all member IDs
|
|
const memberIds = [];
|
|
$('.member-row').each(function() {
|
|
memberIds.push($(this).data('user-id'));
|
|
});
|
|
|
|
// Remove any existing hidden inputs
|
|
$('input[name="members"]').remove();
|
|
|
|
// Add hidden input for each member ID
|
|
memberIds.forEach(function(id) {
|
|
$('#membersForm').append(`<input type="hidden" name="members" value="${id}">`);
|
|
});
|
|
|
|
// Submit the form
|
|
this.submit();
|
|
});
|
|
});
|