0

Ajax と PHP でファイルをアップロードしようとしていますが、フォルダーの ID を含む入力タイプのテキストを送信できないという問題があります。

ここに私のHTMLがあります：

<form method="post" enctype="multipart/form-data"  action="uploadify.php">
        <input type="file" name="images" id="images" multiple />
        <input type="hidden" name="eid" value="<?php echo $eid;?>" />
        <input type="btn submit" id="btn" value="Upload" />
      </form>

    <div id="response"></div>
    <ul id="image-list">

    </ul>

ここに私のJavaScriptがあります:

(function () {
    var input = document.getElementById("images"), 
        formdata = false;

    function showUploadedItem (source) {
        var list = document.getElementById("image-list"),
            li   = document.createElement("li"),
            img  = document.createElement("img");
        img.src = source;
        li.appendChild(img);
        list.appendChild(li);
    }   

    if (window.FormData) {
        formdata = new FormData();
        document.getElementById("btn").style.display = "none";
    }

    input.addEventListener("change", function (evt) {
        document.getElementById("response").innerHTML = "Uploading . . ."
        var i = 0, len = this.files.length, img, reader, file;

        for ( ; i < len; i++ ) {
            file = this.files[i];

            if (!!file.type.match(/image.*/)) {
                if ( window.FileReader ) {
                    reader = new FileReader();
                    reader.onloadend = function (e) { 
                        showUploadedItem(e.target.result, file.fileName);
                    };
                    reader.readAsDataURL(file);
                }
                if (formdata) {
                    formdata.append("images[]", file);
                }
            }   
        }

        if (formdata) {
            $.ajax({
                url: "uploadify.php",
                type: "POST",
                data: formdata,
                processData: false,
                contentType: false,
                success: function (res) {
                    document.getElementById("response").innerHTML = res; 
                }
            });
        }
    }, false);
}());

そして、ここに私のPHPがあります:

<?php
//upload.php
$eid = $_POST['eid'];
$output_dir = "./images/icons/".$eid."/screenshots/";
if (!file_exists($output_dir) and !is_dir($output_dir)) {
    mkdir($output_dir);  
}


foreach ($_FILES["images"]["error"] as $key => $error) {
    if ($error == UPLOAD_ERR_OK) {
        $name = $_FILES["images"]["name"][$key];
        move_uploaded_file( $_FILES["images"]["tmp_name"][$key], "$output_dir" . $_FILES['images']['name'][$key]);
    }
}


echo "<h2>Successfully Uploaded Images $eid</h2>";

私がやりたいことは、入力タイプ hidden name=eid を送信していますが、何が問題なのかわからないということです。JS 関数を介してこれを送信できないのはなぜですか?

4

2 に答える 2

0 
"The only thing missing is that i am unable to send that eid field . [...] If i will be able to post that field with this function my gallery will be completed"

入力フィールドに ID を与え、フォームから ID を取得すると、ID に対応する値を取得できます。

<input id='theEIdGuy' type="hidden" name="eid" value="<?php echo $eid;?>" />

したがって、PHP がある場合 (フォーム送信後)、このように取得できます。値が名前ではなく識別子 (id) によって識別されることを期待しているため、これが可能になりました。

$eid = isset($_POST['theEIdGuy']) ? $_POST['theEIdGuy'] : "It's not set :(";

三項演算子を使用します。

生の JavaScript を使用すると、次のように取得できます (ただし、PHP でのみ必要な場合は、その必要はありません)。

var theEIdGuy = document.getElementById('theEIdGuy').value;

jQuery を使用すると、次のように取得できます。

var theEIDGuy = $('#theEIdGuy').val();
于 2013-08-22T23:29:54.050 に答える
0

最近、私は同じ質問に直面しました...想像できるように、解決策はより簡単です:)

これを変える：

 if (formdata) {
                    formdata.append("images[]", file);
                }

と：

 if (formdata) {
var variable_eid = document.getElementById("eid");
                    formdata.append("images[]", file);
                    formdata.append("eid", variable_eid);
                }

私にとっては、Jquery/Ajax を使用する方が簡単です。コーディングが少なく、クリーンです。私はあなたのニーズに合わせてすぐに調整しようとしました...

 $(document).ready(function() {
$('#images').change(function(){
var variable_eid = $('#eid').val();
var data;
data = new FormData();
data.append( 'images', $('#file')[0].files[0] );
data.append( 'eid', variable_eid);
 $.ajax({
        url: 'uploadify.php',
        data:data,
       processData: false,
       contentType: false,
        type: 'POST',
        success: function ( data ) {
           $('#response').html(data);
        }
        });
    });
        });
于 2013-12-26T08:55:44.820 に答える