Refresh a table with a new sql query-CodePudding

I have a table that uses php to append the values of an sql query in the table, i need a method that when i press a button, the table makes a new different query and refresh the values.

Example: I have 2 people in the company: john and roger, if I click on the john button, the table will make a sql query looking for john's data, and if I then click on the roger button, the table will be updated again doing a new sql query looking for roger's data, all without refreshing the page

Here is the table code

i tried using js to do the php query again but it seems the php code doesn't work inside the js.

CodePudding user response：

I think you need to load result the .php file into a div for example by using an AJAX request.

https://api.jquery.com/jquery.post/

jquery, ajax, load post result to div

CodePudding user response：

what you can do is: give table body an id and then call js function on button click as you said. Next step would be to make an ajax call in those function and then that call will execute php code. You can do like this:

<tbody id="table_body"></tbody>
<button onclick="changeTableData('john')"></button>
<button onclick="changeTableData('roger')"></button>

//in js:

function changeTableData(name){
    $.ajax({    
      type: "POST",
      url: "path_to_your_php_file",   
      data:{
          name: name,
      },
               
      success: function(data){ 
        console.log(data)
        $('#table_body').html(data);
      }
  });
}

//in php(you can check for the name and then execute query according to your need)

$name = $_POST['name'];

if($name =='john'){
$sqlquery = query with john data
}
elseif($name =='roger'){
$sqlquery = query with rogerdata
}

//at the end echo your data in the form of html like:

echo '<tr>returned data from query</tr>';
echo '<tr>returned data from query</tr>';