Uncaught Typ Fehler für die Eingabe Dateityp

Question

Ich habe ein Formular, und ich versuche, die Datei zu laden, aber ich habe, um die Datei zu bekommen, es zu laden, aber ich bin nicht in der Lage, dies zu tun, wie ich diesen Fehler

main.js:5 Uncaught TypeError: Cannot read property 'value' of null

bin immer

function upload() { 
    var data = new XMLHttpRequest(); 
    var url = "includes/upload.php"; 
    var file = document.getElementById("filename").value; 
    var image = document.getElementById("image").value; 
    var span = document.querySelector('#uploadPreview[style]'), 
     a = window.getComputedStyle(span, null).transform, 
     b = window.getComputedStyle(span, null).transformOrigin; 
    val = 'transform:' + a + ';transform-origin:' + b + ';backface-visibility: hidden;'; 

    var vars = "style=" + val + "&image=" + image + "&filename=" + file; 

    data.open("POST", url, true); 
    data.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    data.onreadystatechange = function() { 
     if (data.readyState == 4 && data.status == 200) { 
      var return_data = data.responseText; 
      document.getElementById("comment_box").innerHTML = return_data; 
     } 
    } 

    data.send(vars); 
} 

Mein HTML-Code:

<form method="POST" enctype="multipart/form-data" style="text-align:center;"> 
    <input id="uploadImage" type="file" id="image" name="image" style="margin:auto;" /> 
    <input type="hidden" id="x" name="x" /> 
    <input type="hidden" id="y" name="y" /> 
    <input type="hidden" id="w" name="w" /> 
    <input type="hidden" id="h" name="h" /> 
    <input type="hidden" id="filename" name="filename" value="<?php if(!empty($data['profile_pic'])) { echo $data['profile_pic'];} ?>" /> 
    <button type="button" name="update_picture" class="btn_form" onclick="upload();">Update Picture</button> 
</form> 

Answer 1

Sie haben 2 ids hier:

<input id="uploadImage" type="file" id="image" name="image" style="margin:auto;" /> 

Versuchen Sie es mit nur einer ID.

Sie können nicht beide haben, können Sie diese Frage here verweisen.