len:3194
len:19
len:6
len:8
len:18
zz22zz技术论坛
首页| 论坛| 消息
主题:【phpwind应用开发教程】ajax文件上传
云天河发表于 2013-03-18 15:33
索引帖:http://www.phpwind.net/read/2935788

相比那个文件上传,这个高级些,传完图片,图片就已经上传到服务器上了。而且不需要刷新页面,有些情况下会用到这个需求,所以我把方案记录在这里。

如图,我们在模板里面加入一个

type="file" id="icon"的文件上传框

为了实现ajax上传文件,我们用了jquery的一个ajax穿文件的包,

同时在这个模板里面的代码如下

Wind.js('/src/extensions'+'/android/res/js/ajaxfileupload.js');

$('.J_upload_preview').on('change', function(e){

/*

$("#loading")

.ajaxStart(function(){

$(this).show();

})//开始上传文件时显示一个图片

.ajaxComplete(function(){

$(this).hide();

});//文件上传完成将图片隐藏起来

*/

var $this = $(this);

var url = '{@url:app/android/manage/doImageUpload}';

$.ajaxFileUpload({

url: url,//用于文件上传的服务器端请求地址

secureuri: false,//一般设置为false

fileElementId: 'icon',//文件上传空间的id属性

dataType: 'json',//返回值类型 一般设置为json

success: function (data, status)//服务器成功响应处理函数

{

alert(data.message);//从服务器返回的json中取出message中的数据,其中message为在struts2中action中定义的成员变量

$('#upload_pic').val(data.data);

if(typeof(data.error) != 'undefined')

{

if(data.error != '')

{

alert(data.error);

}else

{

alert(data.message);

}

}

},

error: function (data, status, e)//服务器响应失败处理函数

{

alert(e);

}

})

return false;

});我们注意到

$.ajaxFileUpload({

是用来处理ajax上传文件的函数

var url = '{@url:app/android/manage/doImageUpload}';我们注意到这个url,这个url是处理文件上传php端的。我将这个函数贴出来

public function doImageUploadAction(){

$_tmpPath = Wind::getRealDir('EXT:android.data');

if($_FILES['icon']['type'] != 'image/png'){

$dataArr = array(

'state' => 'error',

'message' => '请上传png格式的图片,其他格式一律不行。',

);

echo Pw::jsonEncode($dataArr);exit;

}

//todo很多安全都没做

//move_uploaded_file($_FILES['file']['tmp_name'],$_tmpPath.'/'.$_FILES['file']['name']);

move_uploaded_file($_FILES['icon']['tmp_name'],$_tmpPath.'/ic_launcher.png');

$dataArr = array(

'state' => 'success',

'message' => '图片上传成功',

);

echo Pw::jsonEncode($dataArr);exit;

}在里面,我用了move_uploaded_file函数,把jquery穿上来的临时文件,复制到我自己的存储位置。

然后就OK啦。
file.png
浏览大图
描述:ajaxfileupload.zip
附件: ajaxfileupload.zip (3 K) 下载次数:138
下一页 (1/2)
回帖(0):

全部回帖(0)»
最新回帖
收藏本帖
发新帖