Laravel – встроенное редактирование AJAX не сохраняется в базе данных [закрыто]Javascript

Форум по Javascript
Ответить
Anonymous
 Laravel – встроенное редактирование AJAX не сохраняется в базе данных [закрыто]

Сообщение Anonymous »

Я создаю приложение Laravel 10, в котором я могу редактировать таблицу с помощью JavaScript и сохранять обновления в базе данных.
Цель: когда я редактирую ячейку и нажимаю Enter, она должна обновить соответствующую запись в таблице Academic_monitorings.
Проблема: когда я редактирую поле, ничего не происходит, просто сохраняется то, что я редактировал, но это не сохраняется в данных база.
document.querySelectorAll('tr').forEach(row => {
const editBtn = row.querySelector('.edit-btn');
const saveBtn = row.querySelector('.save-btn');

if (!editBtn || !saveBtn) return;

// Enable editing
editBtn.addEventListener('click', () => {
row.querySelectorAll('.display-text').forEach(span => span.classList.add(
'hidden'));
row.querySelectorAll('.edit-input').forEach(input => input.classList.remove(
'hidden'));
editBtn.classList.add('hidden');
saveBtn.classList.remove('hidden');
});

// Save changes
saveBtn.addEventListener('click', () => {
const course = row.querySelector('.edit-input[data-field="course"]').value
.trim();
const school = row.querySelector('.edit-input[data-field="school"]').value
.trim();
const enrollment_type = row.querySelector(
'.edit-input[data-field="enrollment_type"]').value.trim().toUpperCase();
const scholarship_duration = row.querySelector(
'.edit-input[data-field="scholarship_duration"]').value.trim();
const date_started = row.querySelector('.edit-input[data-field="date_started"]')
.value.trim();
const expected_completion = row.querySelector(
'.edit-input[data-field="expected_completion"]').value.trim();
const remarks = row.querySelector('.edit-input[data-field="remarks"]').value
.trim();

const id = row.querySelector('.edit-input[data-field="course"]').dataset
.monitoringId || null;
const scholar_id = row.querySelector('.edit-input[data-field="course"]').dataset
.scholarId;

// Send POST request
fetch("{{ route('admin.reports.monitoring.update-field') }}", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': '{{ csrf_token() }}'
},
body: JSON.stringify([{
id,
scholar_id,
field: 'course',
value: course
},
{
id,
scholar_id,
field: 'school',
value: school
},
{
id,
scholar_id,
field: 'enrollment_type',
value: enrollment_type
},
{
id,
scholar_id,
field: 'scholarship_duration',
value: scholarship_duration
},
{
id,
scholar_id,
field: 'date_started',
value: date_started
},
{
id,
scholar_id,
field: 'expected_completion',
value: expected_completion
},
{
id,
scholar_id,
field: 'remarks',
value: remarks
},
])
})
.then(res => res.json())
.then(data => {
if (data.success) {
// Update table visually
row.querySelector('.display-text[data-field="course"]')
.textContent = course;
row.querySelector('.display-text[data-field="school"]')
.textContent = school;
row.querySelector('.display-text[data-field="enrollment_type"]')
.textContent = enrollment_type;
row.querySelector(
'.display-text[data-field="scholarship_duration"]')
.textContent = scholarship_duration;
row.querySelector('.display-text[data-field="date_started"]')
.textContent = date_started;
row.querySelector(
'.display-text[data-field="expected_completion"]')
.textContent = expected_completion;
row.querySelector('.display-text[data-field="remarks"]')
.textContent = remarks;

// Hide inputs & show display
row.querySelectorAll('.display-text').forEach(span => span
.classList.remove('hidden'));
row.querySelectorAll('.edit-input').forEach(input => input
.classList.add('hidden'));
editBtn.classList.remove('hidden');
saveBtn.classList.add('hidden');

// Update the monitoringId if it was null (new row)
if (!row.querySelector('.edit-input[data-field="course"]')
.dataset.monitoringId) {
const newId = data.monitoring_ids ? data.monitoring_ids[0] :
null;
row.querySelectorAll('.edit-input').forEach(input => input
.dataset.monitoringId = newId);
}
} else {
alert('Failed to save.');
}
})
.catch(err => {
console.error(err);
alert('Error saving data');
});
});
});

контроллер
public function updateMonitoringField(Request $request)
{
$data = $request->all(); // expects array of {id, field, value}

foreach ($data as $item) {
$monitoring = \App\Models\ScholarMonitoring::find($item['id']);
if ($monitoring && in_array($item['field'], [
'course',
'school',
'enrollment_type',
'scholarship_duration',
'date_started',
'expected_completion',
'remarks'
])) {
$monitoring->{$item['field']} = $item['value'];
$monitoring->save();
}
}

return response()->json(['success' => true]);
}


Подробнее здесь: https://stackoverflow.com/questions/797 ... o-database
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»