CODEWITHSUNDEEP
phphtml
AStudentWithQuestionsandAnswer
AStudentWithQuestionsandAnswer

Reputation: 17

How to hide table rows that fetch the info from a database based on string given and when a button is pressed

An HTML table is given in which there are people (agents in this case) who have the following information displayed Id, Name, Rank, Location, and Status. Status can have 3 values. Online, Offline, Disconnected. Based on the status that one of the agents has I want to put 3 buttons as such Online, Offline, and Disconnected, and when a button is pressed to hide the other rows with different values. For example, if I press Online, table rows on the HTML side that contain the status Offline and Disconnected disappear, this goes for the others too the other way around. I have no idea to achieve what I said earlier and I am open to any solution that is deemed to resolve my problem.

<table id="main_table">
      <tr>
        <td>Id</td>
        <td>Agent Name</td>
        <td>Agent Rank</td>
        <td>Agent Location</td>
        <td>Status</td>
      </tr>

      <?php

      require 'CMS/processing/conn.php';

      $result = mysqli_query($con,"SELECT * FROM agents");

      while($info = mysqli_fetch_array($result)) {
      ?>

      <tr>
        <td><?php echo $info['id']; ?></td>
        <td><?php echo $info['agentName']; ?></td>
        <td><?php echo $info['agentRank']; ?></td>
        <td><?php echo $info['locationNames']; ?></td>
        <td><?php echo $info['agentStatus']; ?></td>
      </tr>
    <?php
    }
    ?>
</table>

Upvotes: 0

Views: 430

Answers (3)

Merin Ovelil
Merin Ovelil

Reputation: 377

Try using the below logic : Create 3 buttons with <a> and pass status value as GET to the same page then while fetching check whether it has GET or not

Note:This is not a answer :passing direct GET value to sql query may cause some security issues

<a href="?status=1" class="btn">Online</a>//put the status value based on your status
<a href="?status=2" class="btn">Offline</a>//put the status value based on your status
<a href="?status=3" class="btn">Disconnected</a>//put the status value based on your status

<table id="main_table">
      <tr>
        <td>Id</td>
        <td>Agent Name</td>
        <td>Agent Rank</td>
        <td>Agent Location</td>
        <td>Status</td>
      </tr>

      <?php

      require 'CMS/processing/conn.php';
    if(isset($_GET['status']))
    {
    $result = mysqli_query($con,"SELECT * FROM agents where agentStatus='".$_GET['status']."'");
    }
    else
    {
      $result = mysqli_query($con,"SELECT * FROM agents");
    }
      while($info = mysqli_fetch_array($result)) {
      ?>

      <tr>
        <td><?php echo $info['id']; ?></td>
        <td><?php echo $info['agentName']; ?></td>
        <td><?php echo $info['agentRank']; ?></td>
        <td><?php echo $info['locationNames']; ?></td>
        <td><?php echo $info['agentStatus']; ?></td>
      </tr>
    <?php
    }
    ?>
</table>

Upvotes: 1

Peter Brand
Peter Brand

Reputation: 624

Output echo an attribute on each row <tr data-status="online"> etc. Then in script use document.querySelectorAll("tr[data-status='online'] to find all rows with that status, loop thru the array and toggle each row style.display to 'table-row' or 'none' as required.

You could also do the same using CSS by assigning a class <tr class="online"> etc. Then in script dynamically altering the CSS definition of that class, changing the display to 'table-row' or 'none' as required.

Upvotes: 0

CodingMageSheen
CodingMageSheen

Reputation: 154

I'd use javascript within a tag or jQuery since this sounds like you need dynamic functionality on a static webpage.

For your button pass in the name of the function you're creating inside your tag

<button onclick="yourFunctionName(yourString)"></button>

Inside your tag have the function accept the yourString paramater

function yourFunctionName(yourString){
  if(yourString === "whatever"){
  $('tbody tr').hide()   
  $('tbody tr').show()
 }

etc! Let me know if you need any more clarification on anything

Upvotes: 0

Related Questions