CODEWITHSUNDEEP
phphtmlmysql
Lovi
Lovi

Reputation: 67

PHP SQL Change style of filtered data while still display all data

I hava a page with a list of data displayed from database table and a search bar.

When I filter the data by id, the searched data will be highlighted (background color change) but I need it to remain displaying the rest of data.

I managed to change the background color of searched data however if I search the data that is not in table, the Record not found not displayed.

<?php
$search_keyword = '';
if (isset($_POST['search'])) {
    $search_keyword = $_POST['search'];
}
?>

<head></head>
<body>
    <form name="searchForm" action="" method="POST">
        <input type="text" id="search" name="search" placeholder="Enter Employee ID Search">
    </form>

    <?php
    $sql_search = "";
    if (!empty($search_keyword)) {
        $sql_search = " WHERE id = '" . $search_keyword . "' ";
    }

    $sql1 = "SELECT id, name, address FROM employee";
    $result = $conn->query($sql1);

    if ($result->num_rows > 0) {
        // output data of each row
        while ($row = $result->fetch_assoc()) {
    ?>
    
    <div class="row">
        <div class="employee">
            <?php
            if ($row["id"] == $search_keyword) {
            ?>
            <div class="red-bg">
            <?php
            } else {
            ?>
                <div class="white-bg">
            <?php
            }
            ?>
                    <div class="col-md-2"><?php echo $row["id"] ?></div>
                    <div class="col-md-3"><?php echo $row["name"] ?></div>
                    <div class="col-md-5"><?php echo $row["address"] ?></div>
                </div>
            </div>
        </div>
    </div>
    <?php
        }
    } else {
    ?>
    <div class="row">
        <div class="employee">
            <div class="white-bg">
                <?php echo "Record not found." ?>
            </div>
        </div>
    </div>
    <?php
    }
    ?>
</body>

<script>
    document.onkeydown = function(evt) {
        var keyCode = evt ? (evt.which ? evt.which : evt.keyCode) : event.keyCode;
        if (keyCode == 13) {
            //your function call here
            document.searchForm.submit();
        }
    }
</script>

If I include the search keyword in query, I can display the Record not found when searching for data not in table however if I search data that is in table will only display and highlight 1 data.

$sql1 = "SELECT id, name, address FROM employee ". $sql_search ."";

So how do I display all data and highlight searched data that is in table and only display Record not found when search for data that is not in table?

Upvotes: 0

Views: 50

Answers (1)

Lovi
Lovi

Reputation: 67

I have managed to highlight/bold the search data while still display all the other data and will display a message Record not found if the data is not in table.

<?php
include("database.php");

$search_keyword = '';
if (isset($_POST['search'])) {
    $search_keyword = $_POST['search'];
}
?>

<head>
</head>

<body>
    <form name="searchForm" action="" method="POST">
        <input type="text" id="search" name="search" placeholder="Enter Employee ID Search">
    </form>

    <?php

    //query for searching
    $sql_search_keyword = "";
    if (!empty($search_keyword)) {
        $sql_search_keyword = " WHERE id = '" . $search_keyword . "' ";

        $sql_want_search = "SELECT id, name, address FROM employee" . $sql_search_keyword;
        $result_want_search = $conn->query($sql_want_search);
    
        if ($result_want_search->num_rows > 0) {
            while ($row_want_search = $result_want_search->fetch_assoc()) {
                $searched_data = $row_want_search["id"];
            
                //query for displaying all data - if match with search will bold
                $sql_display_searched = "SELECT id, name, address FROM employee";
                $result_display_searched = $conn->query($sql_display_searched);
            
                if ($result_display_searched->num_rows > 0) {
                    while ($row_display_searched = $result_display_searched->fetch_assoc()) {
                        if ($searched_data == $row_display_searched["id"]) {
                            //bold match
                            echo "<b>" . $row_display_searched["id"] . " " . $row_display_searched["name"] . " " . $row_display_searched["address"] . " </b><br>";
                    } else {
                        echo $row_display_searched["id"] . " " . $row_display_searched["name"] . " " . $row_display_searched["address"] . " <br>";
                        }
                    }
                }
            }
        } else {
            echo "Record not found.";
        }
    } else {
    //Initial display all data before search
    $sql_initial = "SELECT id, name, address FROM employee";
            $result_initial = $conn->query($sql_initial);
    
            if ($result_initial->num_rows > 0) {
                while ($row_initial = $result_initial->fetch_assoc()) {
                echo $row_initial["id"] . " " . $row_initial["name"] . " " . $row_initial["address"] . " <br>";
            }
        }
    }
    ?>

</body>

<script>
    document.onkeydown = function(evt) {
        var keyCode = evt ? (evt.which ? evt.which : evt.keyCode) : event.keyCode;
        if (keyCode == 13) {
            //your function call here
            document.searchForm.submit();
        }
    }
</script>

Upvotes: 2

Related Questions