File upload with jQuery plugin
Halo,
on my computer(lcoalhost) i try make a upload script, that it look like this:
-
<?php
$mosConfig_live_site='http://'.$_SERVER['HTTP_HOST'].'/uplaod_test';
$path_js = $mosConfig_live_site.'/js/';
$path_css = $mosConfig_live_site.'/css/';
?>
<html>
<head>
<script language="JavaScript" type="text/javascript" src="<?php echo $path_js;?>jquery.min.js"></script>
<script language="JavaScript" type="text/javascript" src="<?php echo $path_js;?>ajaxupload_3_5.js"></script>
<script language="JavaScript" type="text/javascript" src="<?php echo $path_js;?>jquery.uploadify.js"></script>
<script language="JavaScript" type="text/javascript" src="<?php echo $path_js;?>ajaxfileupload.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#imageLoadButton").click(function() {
var filename = $("#newImageFile").val();
$.ajax({
type: "POST",
url: "<?php echo $mosConfig_live_site;?>/upload.php",
enctype: 'multipart/form-data',
data: {file: filename, kompId:"<?php echo $id;?>"},
success: function( mydata, status ){
alert( "Data Uploaded: \n\nmydata: "+mydata+",\n\nstatus: "+status);
},
error: function (mydata, status, e)
{
var tmp='';
tmp+="dat[result]: " + mydata['result'] + "<br>";
tmp+='e: '+e+'<br>';
tmp+='status: '+status+'<br>';
console.log("tmp: "+tmp);
}
});
});
});
function ajaxFileUpload()
{
$.ajax({
url: '<?php echo $mosConfig_live_site;?>/upload.php',
type: 'POST',
data: "kompId=<?php echo $id;?>",
contentType: 'multipart/form-data',
success: function (mydata, status)
{
var tmp="";
tmp+="status: "+status+"<br>";
tmp+="mydata-result: "+mydata['result']+"\n";
tmp+="mydata-text: "+mydata['text']+"\n";
console.log("tmp-1: "+tmp);
if( status == 'success' && mydata['result']=='ok' ) {
alert("all OK");
}
},
error: function (mydata, status, e)
{
var tmp='';
tmp+="mydata[result]: " + mydata['result'] + "<br>";
tmp+='e: '+e+'<br>';
tmp+='status: '+status+'<br>';
console.log("tmp-2: "+tmp);
},
complete: function(mytmp){
console.log("complete-3: "+mytmp);
}
});
}
</script>
</head>
<body>
<div>
<form enctype="multipart/form-data" action="" method="POST" name="imageUploadForm">
<input type="file" id="newImageFile" name="newImageFile" size="50" accept="*" />
<br/>
<!-- input type="button" name="imageLoadButton" id="imageLoadButton" value="Image load"/-->
<input type="button" name="imageLoadButtonFunction" id="" value="Image load" onclick="return ajaxFileUpload();"/>
</form>
</div>
</body>
</html>
For the part in
$(document).ready(function() { I use the button that is commentig out.
My upload file (upload.php):
-
<?php
require_once('FirePHPCore/FirePHP.class.php');
$fileElementName = 'newImageFile';
$strLastID=-1;
$upload_pfad='';
$tmpText='';
$bReturn = true;
$arrError=array();
if ( isset($_FILES[$fileElementName]['name']) )
{
echo json_encode( array('result'=>'ok', 'text'=>'all ok Data.\n'.$_FILES[$fileElementName]['name'] ) );
} else {
$firephp = FirePHP::getInstance(true);
$firephp->log( $_FILES, 'array::3::$_FILES');
$firephp->log( $_POST, 'array::4::$_POST');
echo json_encode( array('result'=>'no', 'text'=>'No Data.' ) );
}
?>
The Problem is, that in upload.php I can't get the php Variable
$_FILES, I don't know what I make wrong.
For the upload I try following script:
-
http://valums.com/ajax-upload/
(ajaxupload_3_5.js)
-
http://www.uploadify.com/download/
(jquery.uploadify.js)
-
http://www.phpletter.com/Demo/AjaxFileUpload-Demo/
(ajaxfileupload.js)
Have someone idea what is false in my script?
Regards
reg56