Fix editable complaint fields - attach handlers after section reload
BUGFIX: Event handlers were only attached on initial page load PROBLEM: After implementing editable complaint fields, the inputs wouldn't become editable when adding new complaints via the Smart Complaints Picker. The event handlers were only attached once on page load, not after the section was dynamically reloaded. ROOT CAUSE: When clicking Add or AI Draft buttons, the form submits and the section-complaints area is reloaded from server. The new complaint rows had the input fields but no event handlers attached. SOLUTION: 1. Moved event handler attachment logic into initComplaintTools() function as new attachComplaintFieldHandlers() helper 2. This function is automatically called after section reload 3. Clone-and-replace pattern to prevent duplicate event handlers 4. Fixed table name: ipd_discharge_complaint (not ipd_discharge_comp) FLOW: - Add complaint → section reloads → initComplaintTools() runs → attachComplaintFieldHandlers() attaches blur/keydown handlers → editable fields work Now clicking on complaint name/remark inputs works for both: - Existing complaints (on page load) - Newly added complaints (after section reload)
This commit is contained in:
parent
2e6bff35a0
commit
ddec3cec69
|
|
@ -2828,7 +2828,7 @@ class Ipd_discharge extends BaseController
|
|||
return $this->response->setJSON(['success' => false, 'error' => 'Invalid parameters']);
|
||||
}
|
||||
|
||||
$table = 'ipd_discharge_comp';
|
||||
$table = 'ipd_discharge_complaint';
|
||||
if (! $this->db->tableExists($table)) {
|
||||
return $this->response->setJSON(['success' => false, 'error' => 'Complaint table not found']);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1930,6 +1930,95 @@ $allergyStatusNoKnown = in_array($allergyStatusNormalized, ['no known drug aller
|
|||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Attach event handlers to editable complaint fields (name and remark)
|
||||
attachComplaintFieldHandlers(section, form);
|
||||
}
|
||||
|
||||
function attachComplaintFieldHandlers(section, form) {
|
||||
if (!section || !form) {
|
||||
return;
|
||||
}
|
||||
|
||||
function saveComplaintField(input, fieldType) {
|
||||
var complaintId = input.getAttribute('data-complaint-id');
|
||||
var newValue = input.value.trim();
|
||||
var originalValue = input.getAttribute('data-original-value');
|
||||
|
||||
if (newValue === originalValue) {
|
||||
return;
|
||||
}
|
||||
|
||||
var csrfPair = getCsrfPair(form);
|
||||
var formData = new FormData();
|
||||
formData.append(csrfPair.name, csrfPair.value);
|
||||
formData.append('complaint_id', complaintId);
|
||||
formData.append('field_type', fieldType);
|
||||
formData.append('field_value', newValue);
|
||||
|
||||
fetch('<?= site_url('Ipd_discharge/update_complaint_field') ?>', {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
}).then(function(response) {
|
||||
return response.json();
|
||||
}).then(function(data) {
|
||||
if (data.success) {
|
||||
input.setAttribute('data-original-value', newValue);
|
||||
input.style.borderColor = '#28a745';
|
||||
setTimeout(function() {
|
||||
input.style.borderColor = '';
|
||||
}, 1000);
|
||||
} else {
|
||||
console.error('Failed to save complaint field:', data.error || 'Unknown error');
|
||||
input.style.borderColor = '#dc3545';
|
||||
setTimeout(function() {
|
||||
input.style.borderColor = '';
|
||||
}, 2000);
|
||||
}
|
||||
}).catch(function(err) {
|
||||
console.error('Error saving complaint field:', err);
|
||||
input.style.borderColor = '#dc3545';
|
||||
setTimeout(function() {
|
||||
input.style.borderColor = '';
|
||||
}, 2000);
|
||||
});
|
||||
}
|
||||
|
||||
// Complaint Name input handlers
|
||||
section.querySelectorAll('.discharge-complaint-name-input').forEach(function(input) {
|
||||
// Remove any existing handlers by cloning the element
|
||||
var newInput = input.cloneNode(true);
|
||||
input.parentNode.replaceChild(newInput, input);
|
||||
|
||||
newInput.addEventListener('blur', function() {
|
||||
saveComplaintField(this, 'name');
|
||||
});
|
||||
|
||||
newInput.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault();
|
||||
this.blur();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Complaint Remark input handlers
|
||||
section.querySelectorAll('.discharge-complaint-remark-input').forEach(function(input) {
|
||||
// Remove any existing handlers by cloning the element
|
||||
var newInput = input.cloneNode(true);
|
||||
input.parentNode.replaceChild(newInput, input);
|
||||
|
||||
newInput.addEventListener('blur', function() {
|
||||
saveComplaintField(this, 'remark');
|
||||
});
|
||||
|
||||
newInput.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault();
|
||||
this.blur();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function setSectionStatus(id, text, level) {
|
||||
|
|
@ -3895,86 +3984,6 @@ $allergyStatusNoKnown = in_array($allergyStatusNormalized, ['no known drug aller
|
|||
}, { passive: true, capture: true });
|
||||
syncNavOnScroll();
|
||||
|
||||
// ═══════════════════════════════════════════════════════════════════
|
||||
// Editable Complaint Name and Remark Fields
|
||||
// ═══════════════════════════════════════════════════════════════════
|
||||
function saveComplaintField(input, fieldType) {
|
||||
var complaintId = input.getAttribute('data-complaint-id');
|
||||
var newValue = input.value.trim();
|
||||
var originalValue = input.getAttribute('data-original-value');
|
||||
|
||||
if (newValue === originalValue) {
|
||||
return;
|
||||
}
|
||||
|
||||
var form = document.getElementById('discharge_main_form');
|
||||
if (!form) {
|
||||
return;
|
||||
}
|
||||
|
||||
var csrfPair = getCsrfPair(form);
|
||||
var formData = new FormData();
|
||||
formData.append(csrfPair.name, csrfPair.value);
|
||||
formData.append('complaint_id', complaintId);
|
||||
formData.append('field_type', fieldType);
|
||||
formData.append('field_value', newValue);
|
||||
|
||||
fetch('<?= site_url('Ipd_discharge/update_complaint_field') ?>', {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
}).then(function(response) {
|
||||
return response.json();
|
||||
}).then(function(data) {
|
||||
if (data.success) {
|
||||
input.setAttribute('data-original-value', newValue);
|
||||
input.style.borderColor = '#28a745';
|
||||
setTimeout(function() {
|
||||
input.style.borderColor = '';
|
||||
}, 1000);
|
||||
} else {
|
||||
console.error('Failed to save complaint field:', data.error || 'Unknown error');
|
||||
input.style.borderColor = '#dc3545';
|
||||
setTimeout(function() {
|
||||
input.style.borderColor = '';
|
||||
}, 2000);
|
||||
}
|
||||
}).catch(function(err) {
|
||||
console.error('Error saving complaint field:', err);
|
||||
input.style.borderColor = '#dc3545';
|
||||
setTimeout(function() {
|
||||
input.style.borderColor = '';
|
||||
}, 2000);
|
||||
});
|
||||
}
|
||||
|
||||
// Complaint Name input handlers
|
||||
document.querySelectorAll('.discharge-complaint-name-input').forEach(function(input) {
|
||||
input.addEventListener('blur', function() {
|
||||
saveComplaintField(this, 'name');
|
||||
});
|
||||
|
||||
input.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault();
|
||||
this.blur();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Complaint Remark input handlers
|
||||
document.querySelectorAll('.discharge-complaint-remark-input').forEach(function(input) {
|
||||
input.addEventListener('blur', function() {
|
||||
saveComplaintField(this, 'remark');
|
||||
});
|
||||
|
||||
input.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault();
|
||||
this.blur();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
})();
|
||||
</script>
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user