The publishers' web pages are constituted of "div" elements with are in fact product small cards with comic book cover, a few details and a link for a specific comic book page with additional information.
When clicking on one card the server has to understand which comic book we desire additional data about in order to build dinamically a detailed page for that specifica comic book.
When creating the small card, it would be useful to add an id property to the
element. The id would be the comic book id from the database. To this, an event listener could be associated to use that id to perform a query to the database for the comic book information required for its page.
The buildComicBookSmallCard.js script has been modified in order to obtain the cbID attribute from the database which is added to each "div" element representing each comic book small card. Next step is to try to add an event listener that may exploit this piece of information (the comic book ID) to perform a new MySQL query to retrieve detailed information about the comic book and build a bigger card to be added via JavaScript to the web page of the comic book.
Instead of creating an event listener to exploit the id information in each comic book card (specifically in the "div" element), which is still not clear how to implement, I resolved to add a query string in the "href"s of the image and title of each comic book small card. Specifically I programmatically add "?id='cbID'&series='seriesName'&coverTitle='coverTitle'" to the "comics/comic_book.php" "href"s used by the small card's elements. Information in the query string is stored in the $_GET superglobal and can be used within PHP code in the requested resource. In particular the series name and the cover title are used to create the title in the "head" of the comic book page, while the cbID is used in a MySQL query to obtain information used to build a detailed web page about the comic book.
The publishers' web pages are constituted of "div" elements with are in fact product small cards with comic book cover, a few details and a link for a specific comic book page with additional information. When clicking on one card the server has to understand which comic book we desire additional data about in order to build dinamically a detailed page for that specifica comic book. When creating the small card, it would be useful to add an id property to the
The buildComicBookSmallCard.js script has been modified in order to obtain the cbID attribute from the database which is added to each "div" element representing each comic book small card. Next step is to try to add an event listener that may exploit this piece of information (the comic book ID) to perform a new MySQL query to retrieve detailed information about the comic book and build a bigger card to be added via JavaScript to the web page of the comic book.
Instead of creating an event listener to exploit the id information in each comic book card (specifically in the "div" element), which is still not clear how to implement, I resolved to add a query string in the "href"s of the image and title of each comic book small card. Specifically I programmatically add "?id='cbID'&series='seriesName'&coverTitle='coverTitle'" to the "comics/comic_book.php" "href"s used by the small card's elements. Information in the query string is stored in the $_GET superglobal and can be used within PHP code in the requested resource. In particular the series name and the cover title are used to create the title in the "head" of the comic book page, while the cbID is used in a MySQL query to obtain information used to build a detailed web page about the comic book.