如何使用Ajax发送变量？

I am trying to upload files with Ajax & PHP but the problem is I am not able to send input type text which contains the id of the folder.

Here is my 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>

Here is my 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);
}());

And here is my 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>";

What I want to do is that I am sending input type hidden name=eid but don't know what's wrong, why am I not able to send this through my JS function?

"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"

Give the input field an id, fetch the id from the form and therefor you can fetch the value corresponding to the id:

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

So if we had PHP (after form submit) we could retrieve it like this, this is now possible because it's expecting the value to be identified by an identifier(id), not name.

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

using the ternary operator.

Using raw javascript you could get it like this (But you don't have to if you only need it in PHP):

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

Using jQuery you could get it like this:

var theEIDGuy = $('#theEIdGuy').val();

These days I faced the same question... the solution is more simple as you can imagine :)

change this:

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

with:

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

For me is more simple to use Jquery/Ajax.. there is less coding and clean. I tried quickly to adjust it for your needs...

 $(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);
        }
        });
    });
        });