|
|
Line 7: |
Line 7: |
| cards.forEach(function(card) { | | cards.forEach(function(card) { |
| card.addEventListener('click', function() { | | card.addEventListener('click', function() { |
| // Extract entry number from the clicked card
| | // Log a message to the console when a card is clicked |
| var entryNumber = this.querySelector('.entry-number').textContent;
| | console.log('Card clicked!'); |
| | |
| // Log entry number to the console for debugging | |
| console.log('Clicked on card with entry number:', entryNumber); | |
| | |
| // Call openModal with the entry number
| |
| openModal(entryNumber);
| |
| }); | | }); |
| }); | | }); |
| }); | | }); |
|
| |
| function openModal(entryNumber) {
| |
| // Log to the console for debugging
| |
| console.log('Opening modal for entry number:', entryNumber);
| |
|
| |
| // You can replace this with your logic to fetch and display data
| |
| fetchData(entryNumber)
| |
| .then(function(data) {
| |
| // Log to the console for debugging
| |
| console.log('Data fetched successfully:', data);
| |
|
| |
| // Display data in the modal
| |
| document.getElementById('modalContent').innerHTML = data;
| |
|
| |
| // Show the modal
| |
| document.getElementById('myModal').style.display = 'block';
| |
| })
| |
| .catch(function(error) {
| |
| // Log to the console for debugging
| |
| console.error('Error fetching data:', error);
| |
| });
| |
| }
| |
|
| |
| function closeModal() {
| |
| // Log to the console for debugging
| |
| console.log('Closing modal');
| |
|
| |
| // Hide the modal
| |
| document.getElementById('myModal').style.display = 'none';
| |
| }
| |
|
| |
| // Replace this function with your actual logic to fetch data
| |
| function fetchData(entryNumber) {
| |
| // Dummy data for demonstration
| |
| var dummyData = '<h2>Card ' + entryNumber + '</h2><p>This is some information about Card ' + entryNumber + '.</p>';
| |
| return Promise.resolve(dummyData);
| |
| }
| |