worked on short code and sender ID modules
This commit is contained in:
Kwesi Banson Jnr
197
public/assets/js/sender-ids.js
Normal file
197
public/assets/js/sender-ids.js
Normal file
@@ -0,0 +1,197 @@
|
||||
$(document).ready(function() {
|
||||
|
||||
const senderModal = new bootstrap.Modal(document.getElementById('senderModal'));
|
||||
const $form = $('#senderForm');
|
||||
|
||||
$('#edit_mno_name').select2({
|
||||
placeholder: "Select Network Operator",
|
||||
allowClear: true,
|
||||
width: '100%',
|
||||
dropdownParent: $('#senderModal') // Crucial for Bootstrap Modals
|
||||
});
|
||||
$('#edit_supplier_name').select2({
|
||||
placeholder: "Select Supplier",
|
||||
allowClear: true,
|
||||
width: '100%',
|
||||
dropdownParent: $('#senderModal') // Crucial for Bootstrap Modals
|
||||
});
|
||||
|
||||
$('#edit_senderid').on('input', function() {
|
||||
// $(this).val($(this).val().toUpperCase().replace(/\s/g, ''));
|
||||
//$(this).val($(this).val().replace(/\s/g, ''));
|
||||
const max = 11;
|
||||
const val = $(this).val();
|
||||
|
||||
if (val.length > max) {
|
||||
$(this).val(val.slice(0, max));
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// Function to handle the form layout based on Direct MNO selection
|
||||
function toggleSenderIdRoutingFields(selection, isEdit = false) {
|
||||
let prefix = isEdit ? 'edit_' : '';
|
||||
|
||||
let $mnoWrapper = $('#wrapper_mno_name' + (isEdit ? '_edit' : ''));
|
||||
let $supplierWrapper = $('#wrapper_supplier_name' + (isEdit ? '_edit' : ''));
|
||||
let $mnoInput = $('#input_mno_name' + (isEdit ? '_edit' : ''));
|
||||
let $supplierInput = $('#input_supplier_name' + (isEdit ? '_edit' : ''));
|
||||
|
||||
if (selection === 'YES') {
|
||||
// Show MNO, Hide Supplier
|
||||
$mnoWrapper.slideDown();
|
||||
$mnoInput.prop('required', true);
|
||||
|
||||
$supplierWrapper.slideUp();
|
||||
$supplierInput.prop('required', false).val(''); // Clear hidden field
|
||||
} else {
|
||||
// Show Supplier, Hide MNO
|
||||
$supplierWrapper.slideDown();
|
||||
$supplierInput.prop('required', true);
|
||||
|
||||
$mnoWrapper.slideUp();
|
||||
$mnoInput.prop('required', false).val(''); // Clear hidden field
|
||||
}
|
||||
}
|
||||
|
||||
// Trigger on change for Create Form
|
||||
$('#create_direct_mno').on('change', function() {
|
||||
toggleSenderIdRoutingFields($(this).val(), false);
|
||||
});
|
||||
|
||||
// If you have an Edit form, trigger it there as well
|
||||
// $('#edit_direct_mno').on('change', function() {
|
||||
// toggleSenderIdRoutingFields($(this).val(), true);
|
||||
// });
|
||||
|
||||
// Run on initial load to ensure correct state
|
||||
toggleSenderIdRoutingFields($('#create_direct_mno').val(), false);
|
||||
|
||||
// Bind change event to the select dropdown
|
||||
$('#edit_direct_mno').on('change', function() {
|
||||
toggleSenderIdRoutingFields($(this).val());
|
||||
});
|
||||
|
||||
// --- OPEN MODAL FOR CREATE ---
|
||||
$('#btnOpenSenderModal').on('click', function() {
|
||||
$form[0].reset();
|
||||
$('#senderRecordId').val('');
|
||||
|
||||
$('#senderModalTitle').text('Add Sender ID');
|
||||
$('#btnSubmitSender').html('<i class="bi bi-send me-2"></i>Save Sender ID');
|
||||
|
||||
// Reset toggle state to YES
|
||||
$('#edit_direct_mno').val('YES').trigger('change');
|
||||
|
||||
senderModal.show();
|
||||
});
|
||||
|
||||
// --- OPEN MODAL FOR EDIT ---
|
||||
$('.btn-edit-sender').on('click', function() {
|
||||
const data = $(this).data();
|
||||
|
||||
$form[0].reset();
|
||||
$('#senderRecordId').val(data.id);
|
||||
|
||||
$('#edit_senderid').val(data.senderid);
|
||||
$('#edit_direct_mno').val(data.direct_mno);
|
||||
|
||||
// Set dependent fields before toggling
|
||||
$('#edit_mno_name').val(data.mno_name);
|
||||
$('#edit_supplier_name').val(data.supplier_name);
|
||||
|
||||
$('#edit_type').val(data.type);
|
||||
$('#edit_bind_name').val(data.bind_name);
|
||||
$('#edit_status').val(data.status);
|
||||
$('#edit_remarks').val(data.remarks);
|
||||
|
||||
$('#senderModalTitle').text('Edit Sender ID: ' + data.senderid);
|
||||
$('#btnSubmitSender').html('<i class="bi bi-save me-2"></i>Update Sender ID');
|
||||
|
||||
// Trigger the toggle layout based on the loaded data
|
||||
toggleSenderIdRoutingFields(data.direct_mno);
|
||||
|
||||
senderModal.show();
|
||||
});
|
||||
|
||||
// --- HANDLE FORM SUBMISSION (Actual AJAX) ---
|
||||
$form.on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const $btn = $('#btnSubmitSender');
|
||||
const originalText = $btn.html();
|
||||
const $alertBox = $('#senderIdModalAlert');
|
||||
|
||||
// Show loading state and clear old errors
|
||||
$btn.html('<span class="spinner-border spinner-border-sm me-2"></span> Processing...');
|
||||
$btn.prop('disabled', true);
|
||||
$alertBox.html('');
|
||||
$form.find('.is-invalid').removeClass('is-invalid');
|
||||
$form.find('.invalid-feedback').remove();
|
||||
|
||||
// Determine if we are creating or updating based on the hidden ID field
|
||||
const recordId = $('#senderRecordId').val();
|
||||
const submitUrl = base_url + "/" + recordId ? "senderids/" + recordId : "senderids";
|
||||
|
||||
// Add a hidden _method field for PUT requests if editing
|
||||
let formData = $form.serialize();
|
||||
if (recordId) {
|
||||
formData += '&_method=PUT';
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url: submitUrl,
|
||||
type: 'POST', // We use POST but pass _method=PUT in the data payload for Laravel
|
||||
data: formData,
|
||||
success: function(response) {
|
||||
if (response.success) {
|
||||
senderModal.hide();
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: 'Success!',
|
||||
text: response.message || 'Sender ID record saved.',
|
||||
confirmButtonColor: '#5c4df0'
|
||||
}).then(() => {
|
||||
// Reload the page to refresh the table and KPI counts
|
||||
location.reload();
|
||||
});
|
||||
}
|
||||
},
|
||||
error: function(xhr) {
|
||||
// Handle Laravel Validation Errors
|
||||
if (xhr.status === 422) {
|
||||
let errors = xhr.responseJSON.errors;
|
||||
|
||||
$alertBox.html(`
|
||||
<div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
|
||||
<i class="bi bi-exclamation-triangle-fill me-2"></i>
|
||||
<div>Please check the highlighted fields below.</div>
|
||||
</div>
|
||||
`);
|
||||
|
||||
// Highlight specific invalid fields
|
||||
$.each(errors, function(key, value) {
|
||||
let $input = $form.find('[name="' + key + '"]');
|
||||
if ($input.length) {
|
||||
$input.addClass('is-invalid');
|
||||
$input.parent().append('<div class="invalid-feedback d-block fw-medium small">' + value[0] + '</div>');
|
||||
}
|
||||
});
|
||||
} else {
|
||||
// Handle standard 500 server errors
|
||||
$alertBox.html(`
|
||||
<div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
|
||||
<i class="bi bi-x-circle-fill me-2"></i>
|
||||
<div>An unexpected server error occurred. Please try again.</div>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
},
|
||||
complete: function() {
|
||||
// Restore button state
|
||||
$btn.html(originalText).prop('disabled', false);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
Reference in New Issue
Block a user