I want to ask how to get the json array data that I have created and display it according to the id chosen when clicking on the instructor's photo.
I have an instructor page that contains a list of instructor data, and an instructor's detail page which is a detailed description of the instructor that is clicked from the instructor's page.
I already have json data, but I can't call the data according to id, which looks like all the data is listed. How do I display data according to the index?
The error looks like the image below.
this is my instructors.php code
<main>
<section id="instructors">
<div class="container">
<div class="row">
<div class="col col-3">
<a href="instructor-detail.php?id=1" class="card-leader">
<div class="image">
<img src="<?= $base_url ?>assets/img/packleaders/shiqeen.jpg" class="img-fluid">
</div>
<div class="content">
<div class="name">Shiqeen</div>
<div class="initial">S</div>
</div>
</a>
</div>
<div class="col col-3">
<a href="instructor-detail.php?id=2" class="card-leader">
<div class="image">
<img src="<?= $base_url ?>assets/img/packleaders/mandy.jpg" class="img-fluid">
</div>
<div class="content">
<div class="name">Mandy</div>
<div class="initial">M</div>
</div>
</a>
</div>
<div class="col col-3">
<a href="instructor-detail.php?id=3" class="card-leader">
<div class="image">
<img src="<?= $base_url ?>assets/img/packleaders/hannah.jpg" class="img-fluid">
</div>
<div class="content">
<div class="name">Hannah</div>
<div class="initial">H</div>
</div>
</a>
</div>
<div class="col col-3">
<a href="packleader.php" class="card-leader">
<div class="image">
<img src="<?= $base_url ?>assets/img/packleaders/bebe.jpg" class="img-fluid">
</div>
<div class="content">
<div class="name">Bebe</div>
<div class="initial">B</div>
</div>
</a>
</div>
<div class="col col-3">
<a href="instructor-detail.php?id=4" class="card-leader">
<div class="image">
<img src="<?= $base_url ?>assets/img/packleaders/charisse.jpg" class="img-fluid">
</div>
<div class="content">
<div class="name">Charisse</div>
<div class="initial">C</div>
</div>
</a>
</div>
<div class="col col-3">
<a href="instructor-detail.php?id=5" class="card-leader">
<div class="image">
<img src="<?= $base_url ?>assets/img/packleaders/sherie.jpg" class="img-fluid">
</div>
<div class="content">
<div class="name">Sherie</div>
<div class="initial">S</div>
</div>
</a>
</div>
</div>
</div>
</section>
</main>
this is my instructor-detail.php code
<main>
<?php
$id = $_GET['id'];
$data = file_get_contents("http://cru68.test/assets/js/data-instructor.json");
$data = json_decode($data, TRUE);
?>
<section id="packleader">
<div class="container-fluid custom-container">
<div class="row">
<?php foreach ($data as $d) { ?>
<div class="col-12 col-sm-12 col-md-12 col-lg-6 video">
<div class="main-video d-flex-justify-content-center">
<div class="content-video">
<img src="assets/img/packleaders/packleaders-video-sample.jpg" alt="" class="img-fluid">
</div>
</div>
</div>
<div class="col-12 col-sm-12 col-md-12 col-lg-6 ">
<div class="biography">
<legend class="title"><?= $d['name']; ?></legend>
<div class="text">
<?= $d['description']; ?>
</div>
</div>
</div>
<?php } ?>
</div>
</div>
</section>
</main>
and this is my json file data-instructor.json code for example
[{
"id": "1",
"name": "Shiqeen",
"description": "<p>Shiqeen wasn’t always a sporty spice. She picked up sports at the age of 17, playing touch rugby for 6 years. After graduating with a diploma in Sports and Exercise Science, she went on to to become a flight attendant. While flying, Shiqeen would visit gyms and studios, trying out fitness programs all around the world which inspired her to take a personal training course.</p> <p>Shiqeen loves high intensity workouts as they challenge the mind and body. Naturally, she got hooked on spinning and boxing, leading her to become a pack leader at CRU. When in class, expect her to be your personal hypegirl, cheering and pushing you past your limits. Dance (twerk) it out on the bag with ‘Shakween’ to hip hop and R&B tunes. We promise you a great sweaty time! </p>",
"image": "shiqeen.jpg"
},
{
"id": "2",
"name": "Mandy",
"description": "<p>Music and Endorphins — that’s what got Mandy hooked on CRU (cycle and box) and motivated her to become a pack leader at both studios - expect block rockin’ beats in her classes that will push you further than you thought you could go.</p> <p>Outside the studio - Mandy is an avid hiker and has explored peaks in Europe, Asia, and North America. The air is better up there and there is a sense of peace you get from being able to disconnect from everything.</p> <p>And if that doesn't do it for you, go for her class so you can hang out with resident CruCycle pupper, Udon.</p>",
"image": "mandy.jpg"
},
{
"id": "3",
"name": "Hannah",
"description": "<p>Hannah's Indoor Cycling journey – from struggling to catch the beat on bike 35, to rallying her riders from the instructor bike – happened right here at CruCycle. Known for her love of old to new school hip hop, Hannah's class is full of speed and swag. Get ready to add that bounce, and throw some groove into your ride.</p> <p> When she isn't teaching, hannah spends her downtime moseying around museums, eating Acai at Juice Junkie, or chillin' at home with her cats.</p> ",
"image": "hannah.jpg"
},
{
"id": "4",
"name": "Charisse",
"description": "<p>Charisse found her way to CruCycle when she was trying to get back in shape after her first child. She loved it so much, the mom of two never left.</p> <p>Hailing from Hong Kong, she has found indoor cycling to be one of the constants in her life, no matter where she is. She truly believes in pursuing what she loves, and wastes no time waiting.</p> <p>When she's not in the studio, she's usually on the plane, searching for a new adventure with her kiddos. If you're looking for some infectious laughs and catchy tunes, come ride with our resident mama.</p>",
"image": "charisse.jpg"
},
{
"id": "5",
"name": "Sherie",
"description": "<p>Sherie lives by the motto: sweat once a day. From yoga to spinning, the sweat life has been part of her journey, and she’s always game to try new workouts.</p> <p> To Sherie, Indoor spinning is more than just a workout – this sweat drippin’, heart racin’, endorphin pumpin’ activity is the most responsible dance party alive. Sherie believes that being on the bike is her way of being 100% present in the moment as she keeps her focus on the beats, the reps, and the energy in the room.</p> <p>Expect slick moves, fast tracks, and a sweat you won’t regret when you show up for Sherie’s class!</p>",
"image": "charisse.jpg"
},
{
"id": "6",
"name": "Kenny",
"description": "<p>Having been on both ends of the scale, Kenny believes that we all stand at different starting lines in our fitness journey. Embarking on his own journey and achieving a personal goal of being a healthier version of himself, he stands by the importance of finding a comfortable pace and working your way up.</p> <p> Kenny challenges his riders to dig deep and find the best versions of themselves without compromise and comparison. From the latest and greatest to throwback pop hits, Kenny is all about serving infectious, unapologetic energy. Be sure to leave Kenny's classes feeling recharged physically and mentally.</p> ",
"image": "kenny.jpg"
},
{
"id": "7",
"name": "Matthew",
"description": "<p>Matthew first fell in love with the CRU culture in 2016 when he began as an avid rider, braving the front row almost daily when he wasn't playing video games. He dreamt of rocking the CruCycle stage himself, so he decided to audition as a Pack Leader and has never looked back!</p> <p>He brings on the extra fun in class and pushes you a little further on the bike. Proving that you can accomplish anything as long as you stay faithful to your vision, Matthew does so in style.</p> ",
"image": "matthew.jpg"
}
]
Aucun commentaire:
Enregistrer un commentaire