jquery PHP image upload (using .post method)

I am trying to upload images on a form but I am using Jquery .Post function in order to submit the data of the form. I get a PHP error of an undifined index. Here is a small portion of my code:

related HTML:

<input type="hidden" name="MAX_FILE_SI开发者_运维问答ZE" value="1000000" />
Picture: <input name="uploadedfile" id="uploadedfile" type="file" />

related jQuery

    $.post("registerCB.php", {
    uploadedfile: $("#uploadedfile").val()
}

The PHP that handles the submission:

//file upload
        $uploadedfile= $_POST["uploadedfile"];



        /*--------------------Image Uploads-------------------------*/
        // Where the file is going to be placed 
        $target_path = "userImages/";

        /* Add the original filename to our target path.  
        Result is "uploads/filename.extension" */
        $target_path = $target_path . basename( $_FILES[$uploadedfile]['name']); 

THE ERROR:

CONCLUSION: I think the issue is the .val() on the image input. I did an alert on that element and it would only alert the file name NOT the entire path.

How can I get the entire path?

ONE MORE THING---- I would like to control the NAME of the file. So no matter what the user uploads I can control the name....is this possible?

THANKS!!!

You should read the PHP documentation about file uploading using POST.

you cant read the value of <input type='data'/> and then post some information via jQuery. you need to post the form via jQuery the <input type='data'> is within!

<form type='post' id='myForm' enctype="multipart/form-data">
<input type='file' name='uploadedFile'/>
</form>


$("myForm").attr("action", "registerCB.php").submit();

and about the reading of the data via php, I would refer to the php.net article

The browser does not include the full path for security reasons. And you can control the name of the file on the server.

If you want to upload asyncronously you should look at some of the existing jquery plugins such as:

http://www.uploadify.com/

or

http://www.phpletter.com/Demo/AjaxFileUpload-Demo/

For Target path you have to use the following:

$target_path = $target_path . basename( $_FILES['uploadedfile']['name']);