GAJAX บทที่ 24 GForm อัปโหลดแบบไม่เปลี่ยนหน้าด้วย GAJAX

<img id="imgupload" alt="image upload" src="test.jpg" />

<form id="frm_upload" action="upload.php" method="post">
<p class="h"><span>อัปโหลด</span><span id="wait" style="visibility: hidden;color:red;">Loading...</span></p>
<p><label for="file">ฺBrowser :</label><input type="file" id="file" name="file" size="40" maxlength="20" /></p>
<p><input id="submit" type="submit" value="อัปโหลด" /></p>
</form>

<?php
    if (!in_array($_FILES[file][type], array('image/pjpeg', 'image/jpeg', 'image/jpg', 'image/gif', 'image/png'))) {
        $ret[] = 'error":"ชนิดของไฟล์ ไม่ถูกต้อง';
    } elseif ($_FILES[file][size] > 200 * 1024) {
        $ret[] = 'error":"ขนาดของไฟล์ มากกว่า 200 kb.';
    } else {
        copy($_FILES[file][tmp_name], 'test.jpg');
        $ret[] = 'error":"อัปโหลดเรียบร้อย';
        $ret[] = 'image":"test.jpg?'.time();
    }
    // คืนค่าเป็น JSON
    echo '[{"'.implode('","', $ret).'"}]';
?>

<script type="text/javascript">
var doUpload = function(xhr){
    try {
        var datas = xhr.responseText.toJSON();
        if (datas[0].error) {
            alert(datas[0].error); // มี error ส่งกลับมา
        };
        if (datas[0].image) {
            $E('imgupload').src = datas[0].image; // มี image ส่งกลับมา
        };
    } catch (e) {
        alert(xhr.responseText); // ถ้าข้อความที่ return มา ไม่ใช่ JSON
    };
};
</script>