0

ERROR: Please browse for a file before clicking the upload button.アップロードする画像ファイルを選択するときに取得し続けます。よりユーザーフレンドリーなエクスペリエンスのために、送信をクリックする代わりに、変更時にファイルをアップロードしようとしています。

HTML

    <div id="profilephoto" class="profilephoto" data-coupling="#content2"><img src="<?php echo $avatar ?>"></div>
    <div id="content2" style="display: none;" class="uploadbutton" data-coupling="#content2">
        <form id="imguploadin" method="POST" action="image_upload_script.php">
            <label class="cabinet"> <i class="icon-upload-alt"></i> Choose Photo
                <input type="file" name="uploaded_file" class="file" onchange="handleFiles(this.files)"/>
            </label>
        </form>
    </div>

jQuery/JavaScript

function handleFiles(files) {
    for (var i = 0; i < files.length; i++) {
        var file = files[i];
        var imageType = /image.*/;

        if (!file.type.match(imageType)) {
            continue;
        }

        var img = document.createElement("img");
        img.classList.add("newphoto");
        img.file = file;
        profilephoto.appendChild(img);

        var reader = new FileReader();
        reader.onload = (function(aImg) { return function(e) { aImg.src = e.target.result; }; })(img);
        reader.readAsDataURL(file);
        var eventt = jQuery.Event("submit");

        $("#imguploadin").trigger(eventt);
    }
}

PHP (image_upload_script.php)

<?php
session_start();
// Access the $_FILES global variable for this specific file being uploaded
// and create local PHP variables from the $_FILES array of information
$username = $_SESSION["username"];
$fileName = $_FILES["uploaded_file"]["name"]; // The file name
$fileTmpLoc = $_FILES["uploaded_file"]["tmp_name"]; // File in the PHP tmp folder
$fileType = $_FILES["uploaded_file"]["type"]; // The type of file it is
$fileSize = $_FILES["uploaded_file"]["size"]; // File size in bytes
$fileErrorMsg = $_FILES["uploaded_file"]["error"]; // 0 for false... and 1 for true
$kaboom = explode(".", $fileName); // Split file name into an array using the dot
$fileExt = end($kaboom); // Now target the last array element to get the file extension
// START PHP Image Upload Error Handling --------------------------------------------------
if (!$fileTmpLoc) { // if file not chosen
    echo "ERROR: Please browse for a file before clicking the upload button.";
    exit();
} else if ($fileSize > 1242880) { // if file size is larger than 5 Megabytes
    echo "ERROR: Your file was larger than 5 Megabytes in size.";
    unlink($fileTmpLoc); // Remove the uploaded file from the PHP temp folder
    exit();
} else if (!preg_match("/.(gif|jpg|png)$/i", $fileName)) {
    // This condition is only if you wish to allow uploading of specific file types
    echo "ERROR: Your image was not .gif, .jpg, or .png.";
    unlink($fileTmpLoc); // Remove the uploaded file from the PHP temp folder
    exit();
} else if ($fileErrorMsg == 1) { // if file upload error key is equal to 1
    echo "ERROR: An error occured while processing the file. Try again.";
    exit();
}
// END PHP Image Upload Error Handling ----------------------------------------------------
// Place it into your "uploads" folder mow using the move_uploaded_file() function
$moveResult = move_uploaded_file($fileTmpLoc, "images/users/$username.$fileExt");
// Check to make sure the move result is true before continuing
if (!$moveResult) {
    echo "ERROR: File not uploaded. Try again.";
    unlink($fileTmpLoc); // Remove the uploaded file from the PHP temp folder
    exit();
}
// ---------- Include Adams Universal Image Resizing Function --------
include_once("ak_php_img_lib_1.0.php");
$target_file = "images/users/$username.$fileExt";
$resized_file = "images/users/resized_$username.$fileExt";
$wmax = 200;
$hmax = 150;
ak_img_resize($target_file, $resized_file, $wmax, $hmax, $fileExt);
$thumbnail = "images/users/thumb_$username.$fileExt";
$wthumb = 150;
$hthumb = 150;
ak_img_thumb($target_file, $thumbnail, $wthumb, $hthumb, $fileExt);
// ----------- Write Image File path to the server ---------------------------------
$sql_user = "myuser";
$sql_pass = "mypassword";
$sql_ip = "localhost";
$sql_DB = "mydb";
if ($moveResult != true)
    echo("couldnt write file path to database due to unsuccesfull upload");
    else {
    $mysqli = new mysqli($sql_ip, $sql_user, $sql_pass, $sql_DB);
    if ($stmt = $mysqli->prepare("UPDATE users SET avatar=? WHERE username=?")) {
        $user = $_SESSION['username'];
        $avatar = $resized_file;
        $stmt->bind_param('ss', $avatar, $user);
        $stmt->execute();
        $stmt->close();
        //header('location: profile.html');
        return true;
    }
    $mysqli->close();
    }

// ----------- End Adams Universal Image Resizing Function -----------
// Display things to the page so you can see what is happening for testing purposes
echo "The file named <strong>$username.$fileExt</strong> uploaded successfuly.<br /><br />";
echo "It is <strong>$fileSize</strong> bytes in size.<br /><br />";
echo "It is an <strong>$fileType</strong> type of file.<br /><br />";
echo "The file extension is <strong>$fileExt</strong><br /><br />";
echo "The Error Message output for this upload is: $fileErrorMsg";
?>
4

1 に答える 1

4

enctype="multipart/form-data"ファイルをアップロードするために必要な属性がフォームにありません。

于 2013-04-04T18:20:09.237 に答える