Save image name and extension and upload to a specific php folder and then show in a table

Question

When showing a query in a table I create these three fields for the user to update to the line showing the query data:

<?php
$tabela1 .= '<td> <input type="file" name= "Imagem['.$rows_cursos['Id'].']" value="'.$rows_cursos['Imagem'].'"></td>';

$tabela1 .= '<td> <input type="text" name= "Tratamento['.$rows_cursos['Id'].']" value="'.$rows_cursos['Tratamento'].'"></td>';

$tabela1 .= '<td> <input type="radio" name= "Id['.$rows_cursos['Id'].']" value="Pendente"> Pendente  <input type="radio" name= "Id['.$rows_cursos['Id'].']" value="Concluido">Concluido</td>';
?>

In this next step I keep in this way the image path, but it does not guard the complete path, it only keeps the image name and the format "DSCF2712.JPG":

    <?php  
    if(isset($_POST['registar']))
    {
    $servername = "xxx.xxx.x.xx";
    $username = "xxxxx";
    $password = "xxxxxxx";
    $dbname = "xxxxxxxx";

    $conn = new mysqli($servername, $username, $password, $dbname);
    $conn->set_charset('utf8');

    $registro = $_POST['Id'];
    $imagem = $_POST['Imagem'];
    $tratamento = $_POST['Tratamento'];


    foreach($registro as $Id => $estado) { 


        $conn->query("UPDATE RegistoManutencao SET Estado='$registro[$Id]', Imagem = '$imagem[$Id]', Tratamento = '$tratamento[$Id]' WHERE Id='".$Id."'"); 
    } 


    }
    ?>

I’ve been researching and what I realized is ideal is just to keep the name of the image and the extension, as I have, but now how do I show it? I’m doing it this way:

<?php
$result_cursos = "SELECT centrodb.RegistoManutencao.Imagem FROM centrodb.RegistoManutencao";

$resultado_cursos = mysqli_query($conn, $result_cursos);

$tabela1 .= '<div style="float: center" table align="center">';

$tabela1 .= '<table border="5">';

$tabela1 .= '<tr>';

$tabela1 .='<thead>';

$tabela1 .= '<tr>';

$tabela1 .= '<th>Imagem</th>';

$tabela1 .= '</tr>';

$tabela1 .='</thead>'; 

$tabela1 .='<tbody>';

    while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {   

$tabela1 .= '<tr>';

$tabela1 .= '<td><img src="' .$rows_cursos['Imagem']. '" /></td>';

$tabela1 .= '</tr>'; 
}
$tabela1 .= '</tr>';

$tabela1 .='</tbody>'; 

$tabela1 .= '</table>';

$tabela1 .= '</div>';

echo $tabela1;

?>

And the result is this, does not show the image, but if you do inspect it shows the name and the extension that is in the database:

I think the problem is not finding the complete path of the image

Answer 1

In PHP

$registro = $_POST['Id'];

$tratamento = $_POST['Tratamento'];

//Pasta onde as imagens serão salvas
$pasta = "img";
//se não existir será criada
if (!file_exists($pasta)){
    mkdir("$pasta", 0777);
}

$diretorio = "img/";

    foreach ($registro as $Id => $estado) {

        $url = $diretorio .  $_FILES['Imagem']['name'][$Id];

        $nome_arquivo = $_FILES['Imagem']['name'][$Id];

        // salva as imagens na pasta
        move_uploaded_file($_FILES['Imagem']['tmp_name'][$Id], $url);

        // insere o nome com extensão no banco de dados
        $conn->query("UPDATE RegistoDiario SET Estado='$registro[$Id]', Imagem = '$nome_arquivo', Tratamento = '$tratamento[$Id]' WHERE Id='".$Id."'");

    }

In HTML

In the form tag you need to set the enctype to "Multipart/form-data" which indicates that the form we are using will work with sending files

echo "<form method='POST' action='' enctype='multipart/form-data'>";

$tabela1 .= '<td><img src="img/' .$rows_cursos['Imagem']. '" /></td>';

Answer 2

The path of the image is missing,

$tabela1 .= '<td><img src="' .$rows_cursos['Imagem']. '" /></td>';

this would only work if your image is in the same file folder if you use an image folder structure for example that is next to the file ve should do:

$tabela1 .= '<td><img src="/imagens/'.$rows_cursos['Imagem']. '" /></td>';