PHP

Question

enter image description here

I'm looking to filter these small divs on the given filters on top (AB Main Hall, AB Club, Huis 23).

I'm guessing this has to be done with a $_GET? Here's my code from what I now have.

<?php

$concert = [
    [
        "datum" => "20 FEB",
        "naam" => "Kula Shakar",
        "zaal" => "AB Club",
        "image" => "https://img.discogs.com/Ub_IwvshvOIC1n-JL2x5mHHFfRg=/fit-in/300x300/filters:strip_icc():format(jpeg):mode_rgb():quality(40)/discogs-images/A-256590-1106988648.jpg.jpg"
    ],
    [
        "datum" => "25 FEB",
        "naam" => "Black Box",
        "zaal" => "AB Main Hall",
        "image" => "http://highly-suspect.concertticketsq.com/images/performers/event/13-concert-tickets.jpg"
    ],
    [
        "datum" => "28 FEB",
        "naam" => "Screening Pulp",
        "zaal" => "Huis 23",
        "image" => "https://dhzjvxyl79yzn.cloudfront.net/6/83626_0_layton-concert-hall.jpg"
    ],
    [
        "datum" => "4 JUN",
        "naam" => "White Box",
        "zaal" => "AB Club",
        "image" => "data:image/jpeg;base64,/9IiIAIiIAIiIAIiIAIiIAAIiIAIiIAIiIAIiIAIiIAIiIAIiIAIiIA/9k="
    ]

];

?>

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>Concerten</title>
</head>

<body>

<a href="#">AB Main Hall</a>
<a href="#">AB Club</a>
<a href="#">Huis 23</a>
    <?php foreach($concert as $concerten): ?>


    <section class="container">

        <p><?php echo $concerten['datum']; ?></p>
        <p><?php echo $concerten['naam']; ?></p>
        <h2><?php echo $concerten['zaal']; ?></h2>
        <img src="<?php echo $concerten['image']; ?>"/>

    </section>

<?php endforeach; ?>  

<style>

    .container {
        border: 1px solid black;
        margin: 50px 0px;
        width: 300px;
    }
    p {
        text-align: center;
    }



</style>
</body>

</html>

The items are pulled out from arrays, for example here's the first one.

<?php
$concert = [
    [
        "datum" => "20 FEB",
        "naam" => "Kula Shakar",
        "zaal" => "AB Club",
        "image" => "https://img.discogs.com/Ub_IwvshvOIC1n.jpg"
    ],
?>

Professor Abronsius · Accepted Answer

If you are filtering the display using GET variables you could achieve your goal like this.

<?php
    $concert = array(
        array(
            "datum" => "20 FEB",
            "naam" => "Kula Shakar",
            "zaal" => "AB Club",
            "image" => "https://img.discogs.com/Ub_IwvshvOIC1n-JL2x5mHHFfRg=/fit-in/300x300/filters:strip_icc():format(jpeg):mode_rgb():quality(40)/discogs-images/A-256590-1106988648.jpg.jpg"
        ),
        array(
            "datum" => "25 FEB",
            "naam" => "Black Box",
            "zaal" => "AB Main Hall",
            "image" => "http://highly-suspect.concertticketsq.com/images/performers/event/13-concert-tickets.jpg"
        ),
        array(
            "datum" => "28 FEB",
            "naam" => "Screening Pulp",
            "zaal" => "Huis 23",
            "image" => "https://dhzjvxyl79yzn.cloudfront.net/6/83626_0_layton-concert-hall.jpg"
        ),
        array(
            "datum" => "4 JUN",
            "naam" => "White Box",
            "zaal" => "AB Club",
            "image" => "data:image/jpeg;base64,/9IiIAIiIAIiIAIiIAIiIAAIiIAIiIAIiIAIiIAIiIAIiIAIiIAIiIA/9k="
        )
    );
    /* create array of venues from above to use in generating menu */
    $venues=array();
    foreach( $concert as $arr )$venues[]=$arr['zaal'];

    /* remove duplicates from array */
    $venues=array_unique( $venues );
    /* Add a new item to display all records */
    $venues[]='All';

    $club = isset( $_GET['zaal'] ) && in_array( $_GET['zaal'], $venues ) ?  $_GET['zaal'] : false;

?>
<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Concerten</title>
        <style>
            .container {
                border: 1px solid black;
                margin: 50px 0px;
                width: 300px;
            }
            p {
                text-align: center;
            }
        </style>
    </head>
    <body>
    <?php
        /* display chosen club as title */
        if( $club ) printf('<h1>%s</h1>',$club);

        /* create the list of hyperlinks */
        echo '<ul>';
        array_walk( $venues, function( $club ){
            printf( '<li><a href="?zaal=%s">%s</a></li>', $club, $club );
        });
        echo '</ul>';


        foreach( $concert as $arr ){
            /* display either selected club or all clubs */
            if( $club && $club == $arr['zaal'] or $club=='All' ){
                echo "
                <section class='container'>
                    <p>{$arr['datum']}</p>
                    <p>{$arr['naam']}</p>
                    <h2>{$arr['zaal']}</h2>
                    <img src='{$arr['image']}' />
                </section>";
            }
        }
    ?>
    </body>
</html>

PHP - Filter with $_GET?

Tags:

arrays

html

css

get

Zanic L3

1 Answers

Professor Abronsius

Recent Activity

Donate For Us