Keeping the previous get value and add another value when submitted

Question

I'm a super newbie, so I'll try my best to explain.

I have a blog page that I wanted filtered by category and I want the user to able to click on multiple categories and it will filter to show those posts.

I figured out how to do one post category, I just don't know how to keep the value that has already been clicked and add another value.

What I have now

http://localhost/blog/?filter=issues

What I think I'm looking for

http://localhost/blog/?filter=issues&voices

Nav

<form action="/blog" method="get">
 <ul class="show">
    <li><button name="filter" type="submit" value="all">All</button></li>
    <li><button name="filter" type="submit" value="issues" class="active">Issues</button></li>
    <li><button name="filter" type="submit" value="members-voice">Member's Voice</button></li>
    <li><button name="filter" type="submit" value="politics">Politics</button></li>
    <li><button name="filter" type="submit" value="voices">Voices</button></li>                        
 </ul>                       
</form>

How I query posts

<?php $query = "";
      if ($_GET['filter'] == 'all') {
         $categories = get_categories( $args );
             foreach ($categories as $category) {
               $fliterArray[] = $category->slug;
               $query = implode(",", $fliterArray);
             }
             } else {
               $query = $_GET['filter'];
             }
             ?>
                <ul>
                   <?php $args = array(
                         'post_type' => array('slideshow_article','interior'),
                            'category_name' => $query, // This needs to be either one Categorie or a few Categorie or All Categorie
                            'posts_per_page' => 1000,
                            'meta_query' => array(
                                array(
                                    'key' => 'hide_feed', // name of custom field
                                    'value' => '0',
                                )
                            ),
                        ); ?>

Answer 1

Here is the answer to my question

<?php
    // If there is a value to filter
    if($_GET['filter']) {
        // $urlHasFilter = true;
        // Create an array out of query string of the filters example (issues,voices)
        $urlFilters = explode(',', $_GET['filter']);
    } else {
        // $urlHasFilter = false;
        // if filter has nothing create an empty array
        $urlFilters = array();
    }
    $isAll = '';
    // if filter = all add class active to that link
    if($_GET['filter'] == 'all') {
        $isAll = 'active';
    }
?>


<ul>
    <li><a href="?filter=all" class="<?php echo $isAll; ?>">All</a></li>
    <?php
        $args = array(
            'orderby' => 'name',
            'parent' => 0,
            // 'exclude' => 3,
        );

        $categories = get_categories($args);
        // loop through the categorys that are being used.
        foreach ( $categories as $category ) {
            $class = "";
            $active = false;
            $urlFiltersMinus = array();
            // Loop through the array of query strings
            foreach($urlFilters as $urlFilter) {
                // Added class "active" if matches that Category slug
                if($urlFilter == $category->slug) {
                    $class = "active";
                    $active = true;
                } else {
                    $urlFiltersMinus[] = $urlFilter;
                }
            }
            if($active) {
                $url = implode(',', $urlFiltersMinus);
            } else {
                $urlFiltersMinus[] = $category->slug;
                $url = implode(',', $urlFiltersMinus);
            }
            echo '<li><a href="?filter='.$url.'"class='.$class.'value="'.$url.'">'.$category->name.'</a></li>';
        }
    ?>
</ul>