How to store image in core php using input type file?

PHP
1

this is my form input type file

                            <input type="file" name="picture" id="picture" />
                           <input type="submit" name="submit" value="Register">

  • This is how I am trying to store image selected through that field

              <?php 
                  $onn = mysqli_connect("localhost", "root", ""); 
                  $db = mysqli_select_db($conn,"book");
                         if (isset($_POST['submit'])) { 
                              $picture = $_FILES["picture"]["name"];
                              
                          if($picture != ''){
                            $query = mysqli_query($conn,"INSERT INTO profile (picture) values ('$picture');
                         }
                       }
                 ?>

  • I have given varchar as the datatype to picture field in database table

  • But its showing error like this “Notice: Undefined index: picture”

How can I fix the error ?

3

Try displaying the contents of $_FILES using this PHP function:

<?php 

var_dump( $_FILES );
die; // halt program execution

 $picture = $_FILES["picture"]["name"];

Edit:
Also the form is missing some essential script and will not upload any images.

Further details can be found here:

4

  1. [form enctype=“multipart/form-data”]. Another way you get no valid request.

  2. Path to your file - $_FILES[“picture”][“tmp_name”]. If you want to save binary code of your Image, use fread and e.g. base64_encode. If you want to save local path to your Image, use at first move_uploaded_file.

1 Like
5

Be clear about what you are trying to do. Is that column intended to store the name of the image, or the binary data of the image?

If you browse back through this forum a little while, there is quite a lot of fairly recent discussion of image upload and storage using various different methods.

1 Like
6

I tried this but still its showing same “undefined index picture” error
when I use and see the output after var dump() it is showing empty array

       if (isset($_POST['submit'])){ 
           $targetDir = "uploads/";
           $fileName = basename($_FILES["picture"]["name"]);
           $targetFilePath = $targetDir . $fileName;
          $fileType = pathinfo($targetFilePath,PATHINFO_EXTENSION);
          var_dump( $_FILES );die;

           $allowTypes = array('jpg','png','jpeg','gif','pdf');
          if(in_array($fileType, $allowTypes)){
     
    if(move_uploaded_file($_FILES["picture"]["tmp_name"], $targetFilePath)){
        //insert query
  }
 }
}

where I went wrong? I am unable to get it

7

Can you show the HTML for the form please? In particular the opening form tag.

8

yes this is starting of form

         <form  method="post" id="contact_form" name="cont" enctype="multipart/form-data>
          <input type="file" name="picture" id="picture" />
            <input type="submit" name="submit" value="submit >
    </form>
9

Missing closing-quote on enctype?

2 Likes
10

its still showing same undefined index picture error even after I closed the enctype quotes

11

What about if you close the quotes on the end of the submit button?

Can you show the var_dump() results for $_POST and $_FILES please?

12

Always validate your HTML first or you would get unexpected results that leads your helpers in the wrong direction. Debugging is hard enough, make it easier.

13

This is the result of var_dump($_FILES);

            array(0) { }

and I am getting correct values for $_POST which I want for other form fields but not for $_FILES

14

Well, I don’t get it. This is the basic upload test code I use:

<!DOCTYPE html>
<html lang="en-gb">
<body>
<form method="post" action="uploadtest.php" enctype="multipart/form-data">
<input type="file" name="myfile">
<input type="text" name="myfiletext">
<input type="submit">
</form>
</body>
</html>

and that produces:

array (size=1)
  'myfiletext' => string 'Test Text' (length=9)

array (size=1)
  'myfile' => 
    array (size=5)
      'name' => string 'icecreamvan_real.jpg' (length=20)
      'type' => string 'image/jpeg' (length=10)
      'tmp_name' => string 'C:\wamp\tmp\php39C7.tmp' (length=23)
      'error' => int 0
      'size' => int 96659

when I dump the two arrays, $_POST followed by $_FILES.

Do you have anything else involved in posting the form, some JavaScript or Ajax code?

15

Yes I have used ajax and js also but they are working fine , all the actions associated with them are working perfectly just img is not uploading

16

So, you have some JS or Ajax code directly involved with uploading the form that you haven’t shown us, it’s all working perfectly, except that a big bit of the form isn’t posting? That seems a strange definition of “perfectly” to me, unless I am misunderstanding something.

Perhaps you could show the form upload code, too.

17

when I comment code related image upload alll the data is storing correctly in database but when I add the upload image code again then data is not inserting in database table.

18

Need to see the code, can’t image what it is doing. If your upload code is resulting in an empty $_FILES array, then there must be a problem with it somewhere, surely?

19

this is my ajax code

                  $("#upload").submit(function(e){
                                       var form_data = $('form').serialize();
                                       $.ajax({
                                                type: "post", 
                                                url: "upload.php",
                                                contentType: false,
                                                processData:false,
                                                cache: false,  
                                                data: form_data,
                                                success: function () {
                                                       //window.location.href='pro.php';   
                                                      } 
                                             }); 
                                       document.getElementById("contact_form").reset();
                      }
20

A quick google suggests that after this line

var form_data = $('form').serialize();

you need to add something like

        var files = $('#picture')[0].files[0];
        form_data.append('file',files);

You may need to experiment some more to get it right - none of the examples I found used .serialize() on the form data.

1 Like
21
  • One doubt
    in above code “#picture” is id of input field , am I right?