How to create FILTER BY LOCATION (Using checkboxes) engine using php and ajax

I have few checkboxes on my hotels webpage . i want to make a simple FILTER BY LOCATION filter engine . which look like this ---

The result should be combination of checkboxes. Now the problem is i have tried to code this this way but couldnt achive what i wanted.when i check on first checkbox it shows result for the same but when i uncheck it displayed data doesnt change back to default. i need to add sql queries for this but i dont know what to add (logic). please help ... Here is my HTML -

<div class="container main-section" id="main">
        <div class="row">
            <div class="col-md-4">
                <h4>Filter by Location </h4>
                <input type="checkbox" id="calangute" name="calangute" />
                <label for="calangute"> Calangute</label><br>
                <input type="checkbox" id="baga" name="baga">
                <label for="baga"> Baga</label><br>
                <input type="checkbox" id="morjim" name="morjim">
                <label for="morjim"> Morjim</label><br>
                <input type="checkbox" id="candolim" name="candolim">
                <label for="candolim"> Candolim</label><br>
                <input type="checkbox" id="anjuna" name="anjuna">
                <label for="anjuna"> Anjuna</label><br>
            </div>
        </div>
    </div>
    <div class="display">
    </div>

Here is my JQuery--

$(document).ready(function(){
getAllRooms(); // this is for getting all data on page load
function getAllRooms(){
    $.ajax({
        url:'action.php',
        method: 'POST',
        data:{rooms:1},
        success:function(response){
            $('.display').html(response);
        }
    });
}

//here is getting data on checking checkboxes

function getRooms(){
        var calangute = $('#calangute').is(':checked') ? 'calangute' : '';
        var baga = $('#baga').is(':checked') ? 'baga' : '';
        var morjim = $('#morjim').is(':checked') ? 'morjim' : '';
        var candolim = $('#candolim').is(':checked') ? 'candolim' : '';
        var anjuna = $('#anjuna').is(':checked') ? 'anjuna' : '';
        $.ajax({
            url: 'action.php',
            method: 'POST',
            data: {
                calangute  : calangute,
                baga : baga,
                morjim : morjim,
                candolim : candolim,
                anjuna : anjuna,
            },
            success:function(response){
                $('.display').html(response);
            }
        });


    }
    $('#calangute').change(function(){
        getRooms();
    });
    $('#baga').change(function(){
        getRooms();
    });
    $('#morjim').change(function(){
        getRooms();
    });
    $('#candolim').change(function(){
        getRooms();
    });
    $('#anjuna').change(function(){
        getRooms();
    });


});

Here is my PHP --

   <?php
$conn=mysqli_connect('localhost','cms_user','12345','rooms');

// this is for getting all data on page load
if (isset($_POST['rooms'])){
    if (isset($_POST['rooms'])){
        $query_all = "SELECT * FROM rooms ORDER BY rand() ";
    }    
    $query_run = mysqli_query($conn,$query_all);
    if (mysqli_num_rows($query_run)>0){
        while ($row = mysqli_fetch_array($query_run)){
            $room_id = $row['id'];
            $room_name = $row['name'];
            $location = $row['location'];
            $stay_type = $row['stay_type'];
            $room_type = ucfirst($row['room_type']);
            $image = $row['image'];
            $price = $row['price'];

            echo "
            <div class='container rooms'>
            <div class='row'>
            <div class='col-md-4'>
            <img src='img/$image' alt='room' width='100%'>
        </div>
        <div class='col-md-6'>
            <h2>$room_name</h2>
            <p>$stay_type</p>
            <h4 class='text-success'>$location</h4>

        </div>
        <div class='col-md-2'>
           <br><br><br><br>
            <h4 class='text-primary'>$room_type</h4>
            <h4>Rs : $price </h4>
           <a href='#'><input type='submit' name='book' value='Book Now' class='btn btn-success'></a>
        </div>
            </div></div>
            ";
        }
    } else {
        echo "<center><h3>No Properties available</h3></center>";
    }

}

//this is for getting data filtered by checkboxes

if (isset($_POST['calangute'])){
    $query = "SELECT * FROM rooms WHERE location = 'calangute' ";
    $run = mysqli_query($conn, $query);
    if (mysqli_num_rows($run)>0){
        while ($row = mysqli_fetch_array($run)){
            $room_id = $row['id'];
            $room_name = $row['name'];
            $location = $row['location'];
            $stay_type = $row['stay_type'];
            $room_type = ucfirst($row['room_type']);
            $image = $row['image'];
            $price = $row['price'];

            echo "
            <div class='container rooms'>
            <div class='row'>
            <div class='col-md-4'>
            <img src='img/$image' alt='room' width='100%'>
        </div>
        <div class='col-md-6'>
            <h2>$room_name</h2>
            <p>$stay_type</p>
            <h4 class='text-success'>$location</h4>

        </div>
        <div class='col-md-2'>
           <br><br><br><br>
            <h4 class='text-primary'>$room_type</h4>
            <h4>Rs : $price </h4>
           <a href='#'><input type='submit' name='book' value='Book Now' class='btn btn-success'></a>
        </div>
            </div></div>
            ";
        }
    }else {
        echo "<center><h3>No Properties available for your search </h3></center>";
    }
}

?>