0

So I have all this code that works fine. But it only shows the table records when I start typing inside the search field. I want all the records to be visible by default the moment I open the page. I know this has something to do with the keyup function but is there a way to have all the records be visible by default before I typed anything inside the search field?

AJAX Live Search/ Input Code

<input type="text" id="search">
<div class="table-container" id="output"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script type="text/javascript">
    $(document).ready(function(){
      $("#search").keyup(function(){
        $.ajax({
          type:'POST',
          url:'search.php',
          data:{
            name:$("#search").val(),
          },
          success:function(data){
            $("#output").html(data);
          }
        });
      });
    });
</script>

PHP Code

$select = "SELECT * FROM info WHERE name LIKE '%".$_POST['name']."%'";
$result = mysqli_query($conn, $select);

if (mysqli_num_rows($result) > 0) {
  while ($row = mysqli_fetch_assoc($result)) {
    echo "
        //table code.. ";
  }

I want it to work like how filter searches would work.

Tristan Tejero
  • 13
  • 1
  • 1
    Your wide open for [SQL injections](https://stackoverflow.com/questions/60174/how-can-i-prevent-sql-injection-in-php) Use prepared statements or PDO to prevent them – Baracuda078 Mar 30 '21 at 08:53
  • Check here [Ajax (remote data)](https://select2.org/data-sources/ajax) – Bhautik Mar 30 '21 at 08:57
  • 1
    If you whant every thing visible then just get all record from your database when the page gets loaded. With javascript you can create a filter. [W3schools](https://www.w3schools.com/howto/howto_js_filter_table.asp) has a nice example on how to do that – Baracuda078 Mar 30 '21 at 08:57

1 Answers1

0

just write another ajax

$('#search').on('click',function(){
        $.ajax({
          type:'GET',
          url:'searchAll.php',
          success:function(data){
            $("#output").html(data);
          }
        });
    });

Then in searchAll.php file write your query php code.

NOTE: Use prepared statements or PDO to prevent SQL injections

Vicky
  • 83
  • 11