PHP Build a Basic PHP Website Listing and Sorting Inventory Items Displaying All Items

Katiuska A
Katiuska A
8,270 Points

My images do not show

I really don't know what I'm missing here. I'm linking to the images folder using the correct path. Also, if I click on the "Books" page, the title "Books" doesn't show. This happens to each of the three categories. It just shows the "Full Catalog" title on all three of them.

At least the array_rand function seems to be working, although I still cannot see the images foe the media titles.

I've looked at this code till my eyes burned. Can you guys please give me a hand?

I have pasted the three files in which I believe the error to be on.

This is catalog.php:

<?php

include("inc/data.php");

include("inc/functions.php");

$pageTitle = "Full Catalog";

$section = null;

if (isset ($_GET["category"])) {

if($_GET["category"] == "books"){

$pageTitle = 'Books';

$section = "books";

} elseif ($_GET["category"] == "movies"){

$pageTitle = 'Movies';

$section = "movies";

} elseif ($_GET["category"] == "music"){

$pageTitle = 'Music';

$section = "music";

}

}

This is index.php: <?php

$pageTitle = "Personal Media Library"; $section = null;

include("inc/header.php"); include("inc/functions.php"); include("inc/data.php");?>

    <div class="section catalog random">

        <div class="wrapper">

            <h2>May we suggest something?</h2>

            <ul class="items">
                <?php 
    $random = array_rand($catalog,4);
    foreach($random as $id) {
     echo get_item_html ($id,$catalog[$id]);
    }
    ?>                              
            </ul>

        </div>

    </div>

</div><!--end content-->

<?php include ("inc/footer.php"); ?>

</body> </html>

This is header.php:

<html> <head> <title><?php echo $pageTitle; ?></title> <link rel="stylesheet" href="css/style.css" type="text/css"> </head> <body>

<div class="header">

    <div class="wrapper">

        <h1 class="branding-title"><a href="/">Personal Media Library</a></h1>

        <ul class="nav">
            <li class="books<?php if ($section == "books") {echo " on";} ?>"><a href="catalog.php?cat=books">Books</a></li>
            <li class="movies<?php if ($section == "movies") {echo " on";} ?>"><a href="catalog.php?cat=movies">Movies</a></li>
            <li class="music<?php if ($section == "music") {echo " on";} ?>"><a href="catalog.php?cat=music">Music</a></li>
            <li class="suggest<?php if ($section == "suggest") {echo " on";} ?>"><a href="suggest.php">Suggest</a></li>
        </ul>

    </div>

</div>

<div id="content">

This is inc/data/php:

<?php

$catalog[101] = [

"title" => "A Design Patterns: Elements of Reusable Object-Oriented Software",

"img" => "img/media/design_patterns.jpg",

"genre" => "Tech",

"format" => "Paperback",

"year" => 1994,

"category" => "Books",

"authors" => [

    "Erich Gamma",

    "Richard Helm",

    "Ralph Johnson",

    "John Vlissides"

],

"publisher" => "Prentice Hall",

"isbn" => '978-0201633610'

];

$catalog[102] = [

"title" => "Clean Code: A Handbook of Agile Software Craftsmanship",

"img" => "img/media/clean_code.jpg",

"genre" => "Tech",

"format" => "Ebook",

"year" => 2008,

"category" => "Books",

"authors" => [

    "Robert C. Martin"

],

"publisher" => "Prentice Hall",

"isbn" => '978-0132350884'

];

$catalog[103] = [

"title" => "Refactoring: Improving the Design of Existing Code",

"img" => "img/media/refactoring.jpg",

"genre" => "Tech",

"format" => "Hardcover",

"year" => 1999,

"category" => "Books",

"authors" => [

    "Martin Fowler",

    "Kent Beck",

    "John Brant",

    "William Opdyke",

    "Don Roberts"

],

"publisher" => "Addison-Wesley Professional",

"isbn" => '978-0201485677'

];

$catalog[104] = [

"title" => "The Clean Coder: A Code of Conduct for Professional Programmers",

"img" => "img/media/clean_coder.jpg",

"genre" => "Tech",

"format" => "Audio",

"year" => 2011,

"category" => "Books",

"authors" => [

    "Robert C. Martin"

],

"publisher" => "Prentice Hall",

"isbn" => '007-6092046981'

];

//Movies

$catalog[201] = [ "title" => "Forrest Gump", "img" => "img/media/forest_gump.jpg", "genre" => "Drama", "format" => "DVD", "year" => 1994, "category" => "Movies", "director" => "Robert Zemeckis", "writers" => [ "Winston Groom", "Eric Roth" ],

"stars" => [
    "Tom Hanks",
    "Rebecca Williams",
    "Sally Field",
    "Michael Conner Humphreys"
]

];

$catalog[202] = [ "title" => "Office Space", "img" => "img/media/office_space.jpg", "genre" => "Comedy", "format" => "Blu-ray", "year" => 1999, "category" => "Movies", "director" => "Mike Judge", "writers" => [ "William Goldman" ],

"stars" => [
    "Ron Livingston",
    "Jennifer Aniston",
    "David Herman",
    "Ajay Naidu",
    "Diedrich Bader",
    "Stephen Root"
]

];

$catalog[203] = [ "title" => "The Lord of the Rings: The Fellowship of the Ring", "img" => "img/media/lotr.jpg", "genre" => "Drama", "format" => "Blu-ray", "year" => 2001, "category" => "Movies", "director" => "Peter Jackson", "writers" => [ "J.R.R. Tolkien", "Fran Walsh", "Philippa Boyens", "Peter Jackson" ],

"stars" => [
    "Ron Livingston",
    "Jennifer Aniston",
    "David Herman",
    "Ajay Naidu",
    "Diedrich Bader",
    "Stephen Root"
]

];

$catalog[204] = [ "title" => "The Princess Bride", "img" => "img/media/princess_bride.jpg", "genre" => "Comedy", "format" => "DVD", "year" => 1987, "category" => "Movies", "director" => "Rob Reiner", "writers" => [ "William Goldman" ],

"stars" => [
    "Cary Elwes",
    "Mandy Patinkin",
    "Robin Wright",
    "Chris Sarandon",
    "Christopher Guest",
    "Wallace Shawn",
    "André the Giant",
    "Fred Savage",
    "Peter Falk",
    "Billy Crystal"
]

]; //Music

$catalog[301] = [ "title" => "Beethoven: Complete Symphonies", "img" => "img/media/beethoven.jpg", "genre" => "Clasical", "format" => "CD", "year" => 2012, "category" => "Music", "artist" => "Ludwig van Beethoven" ];

$catalog[302] = [ "title" => "Elvis Forever", "img" => "img/media/elvis_presley.jpg", "genre" => "Rock", "format" => "Vinyl", "year" => 2015, "category" => "Music", "artist" => "Elvis Presley" ];

$catalog[303] = [ "title" => "No Fences", "img" => "img/media/garth_brooks.jpg", "genre" => "Country", "format" => "Cassette", "year" => 1990, "category" => "Music", "artist" => "Garth Brooks" ];

$catalog[304] = [ "title" => "The Very Thought of You", "img" => "img/media/nat_king_cole.jpg", "genre" => "Jaz", "format" => "MP3", "year" => 2008, "category" => "Music", "artist" => "Nat King Cole" ];

?>

7 Answers

Katiuska A
Katiuska A
8,270 Points

So what I did was have I cleared everything and started again. I don't know what went wrong, I believe I followed thru as I did the first time. I think the issue might have been inside the foreach block. It had so many double quotes and single quotes to keep track of that it's very possible I might have made a mistake there. This is what the block looks like now:

       foreach($catalog as $item) {
       echo "<li><a href='#'><img src='" 
       . $item["img"] . "' alt='"
       . $item["title"] ."'/>"
       . "<p>View Details</p>" 
       . "</a></li>";
        }

As for the categories, as I said before, Alena had just not gotten to that part at this point of the course.

Thanks, guys! :)

Karen Fletcher
Karen Fletcher
13,777 Points

Phew, all those double and single quotes were crazy! Thanks for posting your question, and what you did to fix it! It's really helped me out :)

Hi Katiuska,

Can you please copy and paste all the codes within your /inc/functions.php, /inc/data.php and catalog.php file in markdown format?

Katiuska A
Katiuska A
8,270 Points

OMG, my inc/functions.php disappeared!! I have to effing do it again :( I'll hit you back when I got it.

Thanks so much

Katiuska A
Katiuska A
8,270 Points

I posted the data and catalog files. I found the functions folder but this happened way before I even created that folder.

Katiuska A
Katiuska A
8,270 Points

You know what? I've advanced a bit more on the course and the teacher actually provides the function that sorts the items by category on the different pages. Still, the pictures are not showing. Now I only see an unordered list with the items' titles.

Hi Katiuska,

I would say to start over your lab. It looks like you got to a point where it's probably to cumbersome to troubleshoot. Also, try to watch the video first and then do the lab. If you stuck, go back to the instruction. Hope this is helpful.

I believe that the file path for images should be "/img/media/design_patterns.jpg" instead of "img/media/design_patterns.jpg" at least this works for me

Cliff Jackson
Cliff Jackson
2,886 Points

Same problem for me images do not load just the text