Using ThinkPHP+Uploadify to realize picture uploading function

  • 2021-07-02 23:50:51
  • OfStack

First, unzip the downloaded Uploadify compressed package and put it in a public folder. The implementation code is as follows:

Foreground html section:


<script src="/uploadify/jquery.min.js" data-ke-src="/Public/uploadify/jquery.min.js" type="text/javascript">
<script src="/uploadify/jquery.uploadify.min.js" data-ke-src="/Public/uploadify/jquery.uploadify.min.js" type="text/javascript">
<link rel="stylesheet" type="text/css" href="/uploadify/uploadify.css" data-ke-src="/Public/uploadify/uploadify.css">
<script type="text/javascript">
var img_id_upload=new Array();// Initialize the array to store the names of uploaded pictures 
var i=0;// Initialize array subscripts 
$(function() {
 $('#file_upload').uploadify({
 'auto' : false,// Turn off automatic uploading 
 'removeTimeout' : 600,// File queue upload complete 1 Delete after seconds 
 'swf' : '/Public/uploadify/uploadify.swf',
 'uploader' : '/_URL_/Article/uploadify',
 'method' : 'post', // Method, the server can use the $_POST Array to get data 
 'buttonText' : ' Select a picture ',// Set button text 
 'multi' : true,// Allow multiple pictures to be uploaded at the same time 
 'uploadLimit' : 8,//1 Upload is allowed at most 10 A picture 
 'fileTypeDesc' : 'Image Files',// Only images are allowed to be uploaded 
 'fileTypeExts' : '*.gif; *.jpg; *.png',// Limit the suffixes allowed to upload pictures 
 'fileSizeLimit' : '2000KB',// Limit the size of uploaded pictures 
 'onUploadSuccess' : function(file, data, response) { // The callback function executed after each successful upload returns data from the server to the front end 
$('#image').append('<div style="float:left;margin:2px 0 0 2px"><img width="100px" height="100px" src="/uploads/'+data+'" data-ke-src="/uploads/'+data+'" height=80 width=80 />');
 img_id_upload[i]=data;
 i++;
 }
 });
});
</script>
<input type="file" name="file_upload" id="file_upload" />
<p><a href="javascript:$('#file_upload').uploadify('upload','');" data-ke-src="javascript:$('#file_upload').uploadify('upload','');"> Upload </a>
</p>
<br />
<div id="image" class="image"><br />

action execution code section:


public function uploadify()
 {
 $ph=M('Upload');
 import('ORG.Net.UploadFile');
 $upload = new UploadFile();//  Instantiate the upload class 
 $upload->maxSize = 93145728 ;//  Set attachment upload size 
 $upload->saveRule =rand(1,9999);
 $upload->allowExts = array('jpg', 'gif', 'png', 'jpeg','flv','avi','mov');//  Set attachment upload type 
 $upload->savePath = './Uploads/';//  Set the attachment upload directory 
 if(!$upload->upload())
 {//  Upload Error Prompt Error Message 
 $this->error($upload->getErrorMsg());
 }else{//  Upload succeeded   Get uploaded file information 
 $info = $upload->getUploadFileInfo();
 }
 for($i=0;$i<count($info);$i++)
 {
 $data['name']=$info[$i]['savename'];
 $data['size']=$info[$i]['size'];
 $data['type']=$info[$i]['extension'];
 echo $info[$i]['savename'];
 $rs=$ph->add($data); 
 }
 /*if($rs)
 {
 $this->success(" Success ");
 }else
 {
 $this->error(" Failure ");
 }*/
 }

Readers who are interested in thinkPHP can check the topics of this site: "ThinkPHP Introduction Tutorial", "thinkPHP Template Operation Skills Summary", "ThinkPHP Common Methods Summary", "smarty Template Introduction Basic Tutorial" and "PHP Template Technology Summary".

I hope this article is helpful to the PHP programming based on ThinkPHP framework.


Related articles: