PHP MySQL display data with table rows (clickable)

Question

I have tables that are the publish date of a article and a columns article summary, and those are clickable and should go to a edit page when you click on this. The article should be filled in when you click on it, so you can easy edit the text. I have make the table rows linked but I think I need to take the ID from the tables so it knows what the edit page should be filled in with.

Here is my current code:

<?php
include 'index.php';
include 'login2.php';
?>

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="alleartikelen.css">
    </head>

    <body>
        <h2> Widget news admin </h2>
        <!-- Echo username -->
        <?php
        $user = $_SESSION['user'];
        echo "<p>You are logged in as <b>$user</b>.</p>"; 
        ?>
        <a class="logout" href="index.php">Log out </a>
        <hr>

        <h1> All Articles </h1>
        <?php 


            $sql = "SELECT art_date, art_head FROM article";
            $result = $conn->query($sql); //it makes the query

        ?>

        <style>
        .table td {
    font-family: Merriweather, serif;
    font-size: 16px;
    padding: 10px 5px;
    overflow: hidden;
    word-break: normal;
}

    .table th:first-child,
     .table td:first-child {
    width: 14%;
    height: 10%;
    }
     td,th{
    font-family: "Calibri ";
    }

     tr:nth-child(even){
    background-color: #ddd;
    }

    tr:hover {
        background-color: #F6F6F6;
    }

    th{
        color:white;
        }

        .aa {
    text-decoration: none;
    color: inherit;
     }
        </style>
      <section>   
                <div class="container">  
                    <table class="table">   
                    <tr>     
                        <th>Publication date</th>   
                        <th>Article</th>   
                    </tr>   
      <?php 
      $res=$result->fetch_all(MYSQL_ASSOC); //Splitting all rows in arrays
      $keys = array_keys($res[0]); //Arrays getting attached to $keys
      // Make the results as rows
      echo "<tbody>";
      foreach($res as $rows)
      {
      echo "<tr>";
        foreach($rows as $date)
      {
      echo "<td><a href='bewerkartikel.php'class ='aa'>$date</a>";
      echo "</td>";
     }
     echo "</tr>";
     }
     echo "</tr>";                  


}

?>




</section>  
    </body>
</html>

You need to add an id / css to each cell / container you want to be be editable. With javascript you need to develop an onclick listener for each editable cell / container. Onclick display an input field or textarea. You may use an id or css class. What you need is a respective event listener. Although ids make things easier. — Alexander
– Alexander, Commented Apr 9, 2017 at 10:47
Can you also tell me how? Cause im a beginner and dont know how to do some things. :/ — Realcookie
– Realcookie, Commented Apr 9, 2017 at 10:49
w3schools is usually a good start: w3schools.com/js/js_htmldom_eventlistener.asp — Alexander
– Alexander, Commented Apr 9, 2017 at 10:49
Question is too broad. Flagged. SO isn't a code writing service. — mickmackusa
– mickmackusa ♦, Commented Apr 9, 2017 at 10:50

Junius L · Accepted Answer · 2017-04-09 19:50:55Z

1

Add article id to your link ?art_id=some_id

<?php
    include 'index.php';
    include 'login2.php';

?>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="alleartikelen.css">
    <style>
            .table td {
               font-family: Merriweather, serif;
               font-size: 16px;
               padding: 10px 5px;
               overflow: hidden;
               word-break: normal;
            }

            .table th:first-child,
            .table td:first-child {
               width: 14%;
               height: 10%;
            }
            td,th {
               font-family: "Calibri ";
            }

            tr:nth-child(even){
               background-color: #ddd;
            }

            tr:hover {
                background-color: #F6F6F6;
            }

            th {
                color:white;
             }

            .aa {
                text-decoration: none;
                color: inherit;
            }
     </style>
</head>
<body>
    <h2> Widget news admin </h2>
    <!-- Echo username -->
    <?php
        $user = $_SESSION['user'];
        echo "<p>You are logged in as <b>$user</b>.</p>"; 
    ?>
    <a class="logout" href="index.php">Log out </a>
    <hr>
    <h1> All Articles </h1>
    <?php 
        $sql = "SELECT art_date, art_head, art_id FROM article"; //get article id too
        $result = $conn->query($sql); //it makes the query
     ?>
     <section>   
                    <div class="container">  
                        <table class="table">   
                        <tr>     
                            <th>Publication date</th>   
                            <th>Article</th>   
                        </tr>   
    <?php 

    echo "<tbody>";
      while($rows = $result->fetch_assoc()) {
        echo "<tr>";

            echo "<td>". $rows['art_date'] . "</td>";
            echo "<td><a href='bewerkartikel.php?art_id=" . $rows['id'] . "' class ='aa'> " . $rows['art_head'] . "</a>";
            echo "</td>";

        echo "</tr>";
     }
        echo "</tr>";  

    ?>
    </section>  
        </body>
    </html>

Screenshot

edited Apr 9, 2017 at 19:50

answered Apr 9, 2017 at 11:08

Junius L

16.2k6 gold badges61 silver badges105 bronze badges

Sign up to request clarification or add additional context in comments.

16 Comments

Realcookie Over a year ago

It gives me a error : Notice: Undefined variable: res in C:\xampp\htdocs\dtt\alleartikelen.php on line 77 Warning: Invalid argument supplied for foreach() in C:\xampp\htdocs\dtt\alleartikelen.php on line 77

Junius L Over a year ago

@Realcookie are you using PDO?

Realcookie Over a year ago

After changing $res to $result i only get this error: Warning: Invalid argument supplied for foreach() in C:\xampp\htdocs\dtt\alleartikelen.php on line 77

Realcookie Over a year ago

No im not using pdo

Realcookie Over a year ago

Can you help me further?

|

Alive ColdJuan · Accepted Answer · 2017-04-09 10:56:09Z

1

You need to pass the id to next page so what you need to do is add a id to url like below

"<td><a href='bewerkartikel.php?id=".$date['id']." ' class='aa' >$date</a></td>";

and get the id on bewerkartikel page using

$id = $_GET['id'];

and then you get the particular id to edit.

answered Apr 9, 2017 at 10:56

Alive ColdJuan

507 bronze badges

Collectives™ on Stack Overflow

PHP MySQL display data with table rows (clickable)

2 Answers 2

16 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

16 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related