phpmyadmin Question posted in
The official documentation can be found here.

Insert value of hidden file input into database? – Phpmyadmin

I want to insert the value of my hidden file input into my database but I’m unsure how. My code just keeps inserting blank values to my database, but I want to insert the filename that’s being uploaded. This is my code:

<form action="handler.php" method="post" enctype="multipart/form-data">
    <div id="bd1" class="border">
        <input id="inp1" class="imginp" type="file" name="img1" hidden>
        <img src="https://img.icons8.com/wired/64/000000/add-image.png">
    </div>
    <input type="submit" name="submit">
</form>

<script>
for (let a = 1; a < 3; a++) {
    $("#bd"+a).click(function(e) {
        $(this).children(".imginp").click()
    });
    $('#inp'+a).click(function (e) {
       e.stopPropagation();
    });

    $('#inp'+a).on('change', function(e){
      var files = e.target.files;
      $.each(files, function(i, file){
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function(e){
            template = 
            '<div class="border">'+
                '<input id="inp'+a+'" class="imginp" type="file" name="img'+a+'">'+
                '<img class="blah" src="'+e.target.result+'">'+
            '</div>';
            $('#bd'+a).replaceWith(template);
        };
      });
    });
}
</script>

if (isset($_POST['submit'])) {
    $img1 = $_FILES['img1']['name']; 
    $img1targ = "images/".basename($_FILES['img1']['name']);
    $img1muf = move_uploaded_file($_FILES['img1']['tmp_name'], $img1targ);

    $stmt = $conn->prepare("INSERT INTO images (img1) VALUES (?)");
    $stmt->bind_param("s", $img1);
    $stmt->execute();
    $stmt->close(); 
}
Tags:

2

Answers


  1. 0

    You are dynamically over-writing the input field with javascript, essentially erasing it before it can be submitted.

    File input fields are controlled by the browser. If you debug in Chrome (hit F12, then right-click and inspect), you’ll notice an input field of “file” type never actually changes. There’s no value field, nothing.

    Please see this excellent post:
    Using readAsDataURL() for image preview

    I believe that is close to what you want to do.

    Also, regarding debugging, this is what you would need to do:

    if (isset($_POST['submit'])) {
print "<pre>" . print_r($_POST,TRUE) . "</pre>"; exit;
    $img1 = $_FILES['img1']['name']; 
    $img1targ = "images/".basename($_FILES['img1']['name']);
    $img1muf = move_uploaded_file($_FILES['img1']['tmp_name'], $img1targ);

    $stmt = $conn->prepare("INSERT INTO images (img1) VALUES (?)");
    $stmt->bind_param("s", $img1);
    $stmt->execute();
    $stmt->close(); 
}

    I’ve added the print line that dumps out $_POST and then exits.

    It will show something like this when you click submit:

    Array
(
    [submit] => Submit
)
    Login or Signup to reply.
  2. 0

    There are many ways you can do it.

    1 hide input

    <input type='hidden' name='bla' value='bla'>

    1 hide input 2

    //...
<html>
<head>
  <style>
    /*class to hide inputs, or insert it in a file css*/
    .inputHidden{display:none !important;}
  </style>
</head>
<body>
  
  <!--add class-->
  <input class='inputHidden' type='file' name='bla'>
  
</body>
</html>

    There are other ways with javascript but it’s not necessary in your case.

    And I’m sorry I don’t use jQuery for a while, but I did understand that jQuery has nothing to do with your request to send the name of your file to the database, I also don’t see any problem with your query at all unless if you have a typo there like name of the column or name of the table, types of the columns, length of string in a column …

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search