c2021/INF.03-01-25.01-SG
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add spread data from db to table in main view

Browse Source
This commit is contained in:
baiobelfer 2025-09-10 11:35:22 +00:00
parent 53d00bc5ae
commit e30d313d98
2 changed files with 44 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
i1.html
View File

@ -4,6 +4,8 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Kursy komputerowe</title> <title>Kursy komputerowe</title>
<link rel="stylesheet" href="css/layout.css"> <link rel="stylesheet" href="css/layout.css">
<script src="js/script.js" defer> </script>
</head> </head>
<body> <body>
<header> <header>
@ -17,7 +19,7 @@
</nav> </nav>
<main> <main>
<h3>Kursy komputerowe - programowanie</h3> <h3>Kursy komputerowe - programowanie</h3>
<table> <table id="tab">
<tr> <tr>
<th>Kurs</th> <th>Kurs</th>
<th>Czas trwania</th> <th>Czas trwania</th>

61
js/script.js
View File

@ -1,37 +1,44 @@
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
document.getElementById('oblicz').addEventListener('click', function() { console.log("ok");
// Pobieranie wybranych kursów
const wybraneKursy = document.querySelectorAll('input[name="kurs"]:checked');
// Ceny kursów
const cenaReact = 1500;
const cenaJavaScript = 1200;
// Obliczanie całkowitej kwoty const fetchData = () => {
let calkowitaKwota = 0; return fetch('./php/get.php')
wybraneKursy.forEach(kurs => { .then(response => {
if (kurs.value === 'React.js') { if (!response.ok) {
calkowitaKwota += cenaReact; throw new Error('Błąd pobierania danych');
} else if (kurs.value === 'JavaScript') {
calkowitaKwota += cenaJavaScript;
} }
return response.json();
})
.then(data => {
console.log("Dane załadowane:", data);
renderTable(data); // Wywołaj funkcję renderującą tabelę
})
.catch(error => {
console.error("Błąd:", error);
}); });
};
// Pobieranie liczby rat // Funkcja do renderowania danych w tabeli
const iloscRat = parseInt(document.getElementById('raty').value); const renderTable = (data) => {
// Pobieranie miasta const table = document.getElementById('tab');
const miasto = document.getElementById('miasto').value;
// Sprawdzanie poprawności danych // Usuń wszystkie rzędy po nagłówku (czyli od drugiego)
if (wybraneKursy.length === 0 || isNaN(iloscRat) || iloscRat <= 0) { while (table.rows.length > 1) {
document.getElementById('wynik').textContent = 'Proszę wybrać przynajmniej jeden kurs i podać poprawną liczbę rat.'; table.deleteRow(1);
return;
} }
// Obliczanie miesięcznej raty // Dodaj nowe wiersze dla każdego kursu
const rata = calkowitaKwota / iloscRat; data.forEach(row => {
const tr = document.createElement('tr');
// Wyświetlanie wyniku tr.innerHTML = `
document.getElementById('wynik').textContent = <td>${row.kurs}</td>
`Kurs odbędzie się w ${miasto}. Koszt całkowity: ${calkowitaKwota} zł. Płacisz ${iloscRat} rat po ${rata.toFixed(2)} zł`; <td>${row.czas_trwania}</td>
<td>${row.cena}</td>
`;
table.appendChild(tr);
}); });
};
// Uruchom pobieranie danych
fetchData();
}); });