做一些用户相关信息表单的是时候,有时候会需要用户上传图片,如果是普通的form提交的话,问题非常容易解决,但如果公司想要更好的用户体验,不想让页面跳来跳去的,就需要用ajax来提交了。
但是直接用ajax提交数据的话,是没办法把图片上传的,这里推荐使用uploadajax.js插件进行提交,既可以上传图片,同时可以提交form表单。
具体使用代码:
html代码:
ajax代码:
$('[name="sub"]').click(function(){ var name=$('[name="name"]').val(); var tel=$('[name="tel"]').val(); $.ajaxFileUpload({ url:"{:U('Index/ajax')}", secureuri:false, fileElementId:'path', dataType:"json", type:'post', data:{name:name,tel:tel,structure:structure,area:area}, success:function(data,status){ alert(data[1]); if(data[0]){ setTimeout(loca,1000);//自定义跳转方法loca }else{ setTimeout(hide_div,1000);//自定义隐藏提示框方法hide_div } }, error: function (data, status){ alert(status); } }); }); |
php代码:
public function ajax(){ //=============================================获取用户提交的数据 $name=addslashes($_POST['name']);//用户姓名 $tel=addslashes($_POST['tel']);//用户联系电话 if(empty($name)||empty($tel)||empty($area)){ $res=array(false,'请填写信息!'); echo json_encode($res); exit; } //处理用户上传的房型图,并获取用户上传的图片地址 $upFileName = $_FILES['path']['name']; $upFileSize = $_FILES['path']['size']; $upFileTmpNm = $_FILES['path']['tmp_name']; $upFileType = $_FILES['path']['type']; $upFileErr = $_FILES['path']['error']; if($upFileSize>2*1024*1024){ $res=array(false,'文件必须小于2M'); }else{ $type=array('image/jpg','image/jpeg','image/pjpeg',''); if(in_array($upFileType,$type)){ $upload_name=time(); if($upFileType!=''){ $rs=move_uploaded_file($upFileTmpNm,'./Home/Upload/'.$upload_name.'.jpg'); }else{ $rs=false; } if($rs){ $path='http://localhost/baoming/Home/Upload/'.$upload_name.'.jpg'; }else{ $path=''; } //=============================================获取用户提交的数据over //用户报名时间 $time=date('Y-m-d H:i:s'); //=============================================连接数据库存放用户报名的数据 $model=M('custome'); $m_custome=M('customeAddress'); //根据手机号判断用户名是否已经报名过 $tmp=$model->where('mobilephone="'.$tel.'" and comechild="免费报名"')->find(); if($tmp){ $res=array(false,'您已经报过名了,感谢您的支持!'); }else{ //组织sql语句执行插入数据操作 //$arr=array('tid'=>2,'uname'=>$name,'mobilephone'=>$tel,'structure'=>$structure,'area'=>$area,'path'=>$path,'time'=>$time); $arr=array('uname'=>$name,'mobilephone'=>$tel,'comefrom'=>'网站','comechild'=>'免费报名','img'=>$path,'createTime'=>$time); $rs=$model->add($arr); if($rs===false&&$flag===false){ $res=array(false,'报名失败!'); }else{ $res=array(true,'恭喜你报名成功!'); } } }else{ $res=array(false,'请上传jpg格式图片'); } } echo json_encode($res); ?> |
下载地址:
http://pan.baidu.com/s/1pL91CMJ 密码:yhhv |
宠物免费领养小程序,欢迎来踩