Really Confused about ajax image upload

Over the last couple of weeks I have asked a couple of questions on this subject. It seems as though the harder I try to figure this out, the further away from a solution I appear to be. That may just be a function of me being an idiot

Here is a brief summary of what I have learned so far:

A) There is really no AJAX upload functionality. You are really just updating an Ipage form element. It appears like AJAX, but it truly isn't.

B) There is no AjaxUpload plugin by valumns. At least not named that. After looking at several tutorials on ajax upload that each refer to the AjaxUpload.js plugin and getting absolutely bubkis because on his page, it is not named AjaxUpload.js, it is name something else. If it is even there at all. I didn't feel like going through the hassle of renaming it, and just freaking seeing what happens, because that usually just results in an ugly orgy of errors on obsenities.

C) Alot of the solutions appear to use CAKE. Not really sure what the hell that is, but it looks like some kind of PHP design pattern based off of the popular MVC design pattern. Not really sure though.

D) this appears to be a really hard task. Not something that would take a couple of lines of code and prayer.

D1) The PHP code seems simple enough. Just call the function that moves files... D2) The jquery seems a little bit trickier. Here is where you are calling the above php function. I want to call this when I click inside the text box for the upload... A simple

    $('form#inputId').change(function (){//insert the code to call php function here});

should do that right? The trick is what I write inside of those curly brackets?

That would be the sum-total of what I understand about the subject... This is what I have...

    <?php
    $link = mysql_connect('greetmeet.ipagemysql.com', 'greetmeet', 'Maverick$41'); 
    mysql_select_db(first_1) or die("Opps, You are pretty Got-Damned Stupid!  Did you     realize that?!?!?");
    $target = './Uploads/'; 
    $target = $target . basename( $_FILES['uploaded']['name']) ; 
    $ok=1; 

    $path = "uploads/";
    $Email = $_SESSION['user_email']; //This should be a session ID.  Must talk this over with Fellow Coder That Nigga, LJeezy West...
    $valid_formats = array("jpg", "png", "gif", "bmp","jpeg");

    if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
    {
        $name = $_FILES['photoimg']['name'];
        $size = $_FILES['photoimg'][开发者_高级运维'size'];
        if(strlen($name))
        {
            list($txt, $ext) = explode(".", $name);
            if(in_array($ext,$valid_formats))
            {  
                if($size<(1024*1024)) // Image size max 1 MB
                {
                    $actual_image_name = time().$session_id.".".$ext;
                    $tmp = $_FILES['photoimg']['tmp_name'];
                    if(move_uploaded_file($tmp, $path.$actual_image_name))
                    {
                        mysql_query("UPDATE user_pics SET    profile_pic='$actual_image_name' WHERE Email='$Email'");
                        echo "<img src='uploads/".$actual_image_name."'         class='preview'>";
                    }
                    else
                        echo "failed";
                }
                else
                    echo "Image file size max 1 MB";
                }
            else
                echo "Invalid file format..";
            }
        else
            echo "Please select image..!";
        exit;
    }
    ?>

That would be the php function that I want to call that would move the file to my server and then put the link in the database.

my Again, my jquery code is pretty confusing, and probably all wrong. I just doin't know what to do there. I just want something really simple for now. Nothing fancy, Just upload the photo with preview and then on submit finalize everything. Is there anyway that I could do this by putting the picture directly in mysql btw?

Also, This tutorial seemed usefull... http://www.akchauhan.com/upload-image-using-hidden-iframe/ But really hard to understand...

And this is an example of a pluggin that uses AjaxUpload... Where is the AjaxUpload.js file? http://www.zurb.com/playground/ajax_upload

I suggest using the plugin "ajaxfileupload.js". This is quite easy to use. Please check the link below for its instructions and download: http://www.phpletter.com/Our-Projects/AjaxFileUpload/

Note: This is not using any flash. That is the good aspect of it.

In the tutorial you mentioned you may get lost in the links because the component that is used stopped to be maintaned. Anyway, you find the project here. What you want is the file ajaxupload.js in the root folder of the project.