Skip to content
Snippets Groups Projects

Issue2

Closed Pūslys, A. (Adomas, Student B-TCS) requested to merge (removed):issue2 into main
2 files
+ 146
1
Compare changes
  • Side-by-side
  • Inline
Files
2
@@ -60,4 +60,93 @@ function createPokemonTypesTable() {
</tbody>
</table>
`
}
\ No newline at end of file
}
// ----------------------------- Trainers ---------------------------------------------
function updateTrainerDetails(trainerId) {
const tt = trainerTypes?.data?.find(item => item.id === trainerId);
const parent = document.getElementById(detailsParentId);
parent.innerHTML = `
<div class="card" id="${tt.id}_card">
<img src="${tt.profileUrl}" class="card-img-top" alt="${tt.name}">
<div class="card-body">
<h5 class="card-title">${tt.name} </h5>
<p class="card-text">
Created: ${tt.created} </br>
Last Update: ${tt.lastUpdate} </br>
</p>
</div>
</div>
`
}
function trainerToRow(trainer) {
return `
<tr id="${getRowId(trainer)}" onclick="updateTrainerDetails('${trainer?.id?.trim()}')">
<th scope="row">${trainer.id}</th>
<td>${trainer.name}</td>
<td>${trainer.created}</td>
<td>${trainer.lastUpdate}</td>
</tr>
`
}
function createTrainersTable() {
const tableParent = document.getElementById(tableParentId);
tableParent.innerHTML = `
<table class="table table-striped table-hover">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Name</th>
<th scope="col">Created</th>
<th scope="col">Last Updated</th>
</tr>
</thead>
<tbody>
${
trainerTypes.data.map(trainer => `${trainerToRow(trainer)}`).join("\n")
|| "no data"
}
</tbody>
</table>
`
}
document.addEventListener('DOMContentLoaded', () => {
const form = document.getElementById('addTrainerForm');
form.addEventListener('submit', function (event) {
// prevent submitting through HTML form action
event.preventDefault();
const trainerName = document.getElementById('trainerName').value;
const trainerData = {
name: trainerName
};
// Fetch API to send data to server
fetch('/pokemon/api/trainers/', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(trainerData)
})
.then(response => {
if (!response.ok) {
throw new Error('Network response not ok' + response.statusText);
}
return response.json();
})
.then(data => {
console.log('Success: ', data);
alert('Trainer added successfully!')
})
.catch(error => {
console.error('Error: ', error);
alert('Failed to add trainer: ' + error.message);
});
});
})
Loading