Information being inputed on search is displaying on web URL - Hack The Tech - Latest News related to Computer and Technology

Hack The Tech - Latest News related to Computer and Technology

Get Daily Latest News related to Computer and Technology and hack the world.

Saturday, April 29, 2023

Information being inputed on search is displaying on web URL

The infomation that is being typed on the search bar is getting displayed in the URL. Here is my code,

function filterTable() {
    // Get input values
    var searchInput = document.querySelector('.search').value.toLowerCase();
    var searchBy = document.querySelector('#searchby').value;

    // Get table rows
    var rows = document.querySelectorAll('#tableBody tr');

    // Loop through all rows and hide those that do not match the search query
    var noResults = true;
    for (var i = 0; i < rows.length; i++) {
        var cells = rows[i].querySelectorAll('td');
        var shouldHide = true;
        for (var j = 0; j < cells.length; j++) {
            var cellText = cells[j].textContent.toLowerCase();
            if (cells[j].getAttribute('data-field') === searchBy && cellText.indexOf(searchInput) !== -1) {
                shouldHide = false;
                noResults = false;
                break;
            }
        }
        if (shouldHide) {
            rows[i].style.display = 'none';
        } else {
            rows[i].style.display = '';
        }
    }

    // Show/hide table and "No results found" message based on search query
    if (searchInput === '') {
        tableBody.style.display = 'none';
        noResultsMsg.style.display = "none";
    } else if (noResults) {
        tableBody.innerHTML = "";
        document.querySelector('.table').style.display = 'table';
        noResultsMsg.style.display = "block";
    } else {
        tableBody.style.display = 'table-row-group';
        noResultsMsg.style.display = "none";
    }
}

// Add event listener to search input
document.querySelector('.search').addEventListener('keyup', function(event) {
    // Check if Enter key was pressed
    if (event.keyCode === 13) {
        filterTable();
    }
});

I've tried using the method history.replaceState but still the same. What I am looking for is when the users search the information that they input should not be displayed on the web url. Please note that I am using PHP and Laravel

Here is my HTML code for submit action,

<form method="GET"> 
   <div class="input-group mb-3"> 
     <button class="btn btn-outline-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">Search By</button>
   </div>
</form>


source https://stackoverflow.com/questions/76106626/information-being-inputed-on-search-is-displaying-on-web-url

No comments:

Post a Comment