My photo is not being uploaded to database and files

Question

So for my website you can add options that have pictures, but my code for adding the picture name to the database and the picture itself to a folder is not working.

Here is the code: some things are left out because they are not related to the picture

<form method="POST" class="onderHTFormContainer">
      <p class="onderHTVtext">Optie foto *  </p>
      <input type="file" name="optieFoto" class="onderHTForm" id="optieFoto"><br>
      <input type="submit" name="optieToevoegen" class="onderHTForm knop" value="Optie toevoegen">
</form>

if(isset($_POST['optieToevoegen'])) {

    // foto toevoegen
    $target_dir = "../../fotos/optieFoto/";
    $target_file = $target_dir . basename($_FILES["optieFoto"]["name"]);
    $uploadOk = 1;
    $imageFileType = strtolower(pathinfo($target_file, PATHINFO_EXTENSION));

    if (isset($_POST['optieToevoegen'])) {

        // foto toevoegen
        if ($_FILES["optieFoto"]["tmp_name"] !== '') {
            $check = getimagesize($_FILES["optieFoto"]["tmp_name"]);
            if ($check !== false) {
                echo "File is an image - " . $check["mime"] . ".";
                $uploadOk = 1;
            } else {
                echo "File is not an image.";
                $uploadOk = 0;
            }


            // wanneer de naam, type en docent inputs ingevuld zijn roept de code de optie toevoegen functie aan
            if (empty($_POST['optieNaam']) || empty($_POST['optieType']) || empty($_POST['optieVereiste']) || empty($_POST['optieBegin']) || empty($_POST['optieEind'])) {
                echo "<script type= 'text/javascript'>alert('Niet alle benodigde velden ingevuld, vul eerst benodigde velden in en probeer opnieuw.');</script>";
            } else {
                $optieType = $_POST['optieType'];
                $optieNaam = $_POST['optieNaam'];
                $optieBeschrijving = $_POST['optieBeschrijving'];
                $optieVereiste = $_POST['optieVereiste'];
                $optieBegin = $_POST['optieBegin'];
                $optieEind = $_POST['optieEind'];
                $optieFoto = $_POST["optieFoto"];

                $optieToevoegen = new Docent();
                $optieToevoegen->optieToevoegen($optieType, $optieNaam, $optieBeschrijving, $optieVereiste, $optieBegin, $optieEind, $optieFoto);
            }
        }

        // Check if $uploadOk is set to 0 by an error
        if ($uploadOk == 0) {
            echo "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
        } else {
            if (move_uploaded_file($_FILES["optieFoto"]["tmp_name"], $target_file)) {
                echo "The file " . basename($_FILES["optieFoto"]["name"]) . " has been uploaded.";
            } else {
                echo "Sorry, there was an error uploading your file.";
            }
        }
    }
}

    public function optieToevoegen($optieType, $optieNaam, $optieBeschrijving, $optieVereiste, $optieBegin, $optieEind, $optieFoto)
    {
        $sql = "INSERT INTO optie (optieType, optieNaam, optieBeschrijving, optieVereiste, optieBegin, optieEind, optieFoto) VALUES (:optieType, :optieNaam, :optieBeschrijving, :optieVereiste, :optieBegin, :optieEind, :optieFoto)";
        $stmt = $this->connect()->prepare($sql);

        // bind variables to the prepared statement as parameters
        $stmt->bindValue(":optieType", $optieType);
        $stmt->bindValue(":optieNaam", $optieNaam);
        $stmt->bindValue(":optieBeschrijving", $optieBeschrijving);
        $stmt->bindValue(":optieVereiste", $optieVereiste);
        $stmt->bindValue(":optieBegin", $optieBegin);
        $stmt->bindValue(":optieEind", $optieEind);
        $stmt->bindValue(":optieFoto", $optieFoto);

        $stmtExec = $stmt->execute();
        if ($stmtExec){
            echo "<script type= 'text/javascript'>alert('Optie toevoeging is gelukt en doorgestuurd.');</script>";
        } else{
            echo "<script type= 'text/javascript'>alert('Er is iets fout gegaan, probeer het later opnieuw.');</script>";
        }
    }

Also this code has worked on another one of my websites, the code is the same apart from the optieFoto since that is the only thing that is different. And the name of the picture does get send to the database like it needs to, but the picture itself is not being send to the folder

So turns out i am an idiot and i did not see that i missed a small thing, the thing i overlooked while copying was when opening the form it needs to have

<form method="POST" enctype="multipart/form-data">

Answer 1

@droopsnoot is correct, in that you need to specify enctype attribute in your form element like so:

<form method="POST" enctype="multipart/form-data">
    ...
</form>

From MDN:

enctype
If the value of the method attribute is post, enctype is the MIME type of the form submission. Possible values:

• application/x-www-form-urlencoded: The default value.
• multipart/form-data: Use this if the form contains elements with type=file.
• text/plain: Introduced by HTML5 for debugging purposes.