Submit text and image at the same time

Question

Good evening guys, I have the following question, can someone help me do this (?):

Do submit the image and text at the same time while doing submit. My idea was that the type="file" to make submit of an image in the id="Cover".

And by giving submit or even before the file goes to a folder selected by me in the code and at the same time the file name is in the database.

Can someone put this in the code? I don’t really know how to do it, it seems very complete, but I really need it ss:

<?
require('cdn/inc/header.php'); 

if(isset($_SESSION['user_data'])):
$user_level = $_SESSION['user_data']['level'];


switch($user_level):
case 1:
case 2: 
case 3: 
case 4:
case 5:
case 6:

if ( empty( $_POST)) {
?>


 <div id="user-bar" style="background: #007E99;">
  <i>
   <a href="list-films.php">Editar filmes</a>
  </i>
 </div>

 <br />
 <br />

<form method="post" action=""> 
 <div id="films-add-bars">
  <label for="Title">Titulo do filme</label>
  <input class="films-input" id="Title" type="text" name="Title" required />
 </div>

 <div id="films-add-bars">
  <label for="Cover">Capa</label>
  <input class="films-input" id="Cover" type="text" name="Cover" required />
 </div> 

 <div id="films-add-bars">
  <label for="Duration">Duração do filme</label>
  <input class="films-input" id="Duration" type="text" name="Duration"  pattern = "[0-9:]*" title="Só numeros e ' : ' " maxlength="8" required />
 </div>

 <div id="films-add-bars">
  <label for="Year">Ano de lançamento</label>
  <input class="films-input" id="Year" type="text" maxlength="4" name="Year" required />
 </div> 

 <div id="films-add-bars">
  <label for="Trailer">Trailer (youtube.com)</label>
  <input class="films-input" id="Trailer" type="text" name="Trailer" readonly/> 
 </div>

 <div id="films-add-bars">
  <label for="Embed">Código/Embed</label>
  <textarea class="films-input" id="Embed" type="text" name="Embed"></textarea> 
 </div>

 <br />

 <input type="submit" class="films-insert-btn" name="Submit" value="Salvar alterações" />
</form>

<?
 }  
 else {
 $Author = $_SESSION[ 'username' ];

 $Title = $_POST['Title'];
 $Cover = $_POST['Cover'];
 $Duration = $_POST['Duration'];
 $Year = $_POST['Year'];
 $Trailer = $_POST['Trailer'];
 $Embed = $_POST['Embed'];

 $LastEditUser = $_SESSION[ 'username' ];
 $LastEditDate = date("d-m-Y"); 
 $LastEditHour = date("H:i:s"); 

 $sql = "INSERT INTO films (Author, Title, Cover, Duration, Year, Trailer, Embed, LastEditUser, LastEditDate, LastEditHour) VALUES ( :Author,  :Title, :Cover, :Duration, :Year, :Trailer, :Embed, :LastEditUser, :LastEditDate, :LastEditHour)";

 $query = $db->prepare( $sql );
 $query->execute( array(':Author' => $Author, ':Title' => $Title, ":Cover" => $Cover, ':Duration' => $Duration, ':Year' => $Year, ':Trailer' => $Trailer , ':Embed' => $Embed, ':LastEditUser' => $LastEditUser, ':LastEditDate' => $LastEditDate, 'LastEditHour' => $LastEditHour) );
 header ('Location: edit-films.php'); 
 }
?>

 <br />
 <br />

 <center>

 </center>


<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
</body>
</html>

<?
 endswitch;
 else:
 header( 'Location: ../ ');
 endif;
?>

Answer 1

It’s simple. Change your form header to

<form method="post" action="" enctype="multipart/form-data">

Add the input that will upload the image:

<input id="Cover" type="file" name="Cover">

After Submit, you need to handle sending the form in PHP. Add this together with the part of the code that handles the POST:

//verifica se houve o input "imagem" não veio vazio 
if($_FILES['Cover']['size'] > 0){
    move_uploaded_file($_FILES['Cover']['tmp_name'], $caminhoDeDestinoDaImagem);
}

This is a simple way to do it, it is important to do more validations to handle any errors about file type or name, among others.