yii2 上传图片的示例代码


Posted in PHP onNovember 02, 2018

第一步: 搭建上传类基础工作,具体请看://3water.com/article/120242.htm

第二步:建站一个product表,字段id,name,picurl.

第三步:生GII生成PRODUCT 模型,类,视图。

第四步:

main.css 放在frontend\web\css

.onedialog{position:absolute; left: 300px; top: 500px; z-index: 10; width: 700px; height: 400px;border-radius:5px;box-shadow:5px 2px 6px #000; border: 2px solid #666}
.oneiframe{ width: 100%; height: 100% }

main.js 放在 frontend\web\assets

$(function(){
 $('#product-picurl').click(function(){
 $('#oneupload').remove();
 $('<div>').appendTo($('body')).attr({"class":"onedialog",'id':"oneupload"});
 $('<iframe>').appendTo($('#oneupload')).attr({"src":"?r=upload","class":"oneiframe"})
 });
  var v=$('#product-picurl').val();
 if(v){
 $('<img>').attr({"src":v,"style":"height:50px"}).insertAfter($('#product-picurl'));
 }
});

然后在frontend\assets\AppAsset.php中注册这两个文件

class AppAsset extends AssetBundle
{
  public $basePath = '@webroot';
  public $baseUrl = '@web';
  public $css = [
    'css/site.css',
    'css/main.css',
  ];
  public $js = [
    'assets/main.js'
  ];
  public $depends = [
    'yii\web\YiiAsset',
    'yii\bootstrap\BootstrapAsset',
  ];
}

UploadController.php

<?PHP
namespace frontend\controllers;

use Yii;
use yii\web\Controller;
use app\models\UploadForm;
use yii\web\UploadedFile;

class UploadController extends Controller
{
  public function actionIndex()
  {
    $model = new UploadForm();

    if (Yii::$app->request->isPost) {
      $model->file = UploadedFile::getInstance($model, 'file');

      if ($model->file && $model->validate()) {
        //$model->file->saveAs('uploads/' . $model->file->baseName . '.' . $model->file->extension);      
        $fileName='uploads/' . date("YmdHis") . '.' . $model->file->extension;
        $model->file->saveAs($fileName);
      }
      echo "<script src='assets/upload.js'></script>;";
      echo "<script>";
      echo "var oneinput=parent.document.getElementById('product-picurl');";
      echo "parent.document.getElementById('product-picurl').value='".$fileName."';";
      echo "var oneupload = parent.document.getElementById('oneupload');";
      echo "var img = document.createElement('img');";
      echo "img.setAttribute('style', 'height:50px');";
      echo "img.src ='".$fileName."';";
      echo "insertAfter(img,oneinput);";
      echo "oneupload.parentNode.removeChild(oneupload)";
      echo "</script>";
    }

    return $this->render('upload', ['model' => $model]);
  }
}
?>

UploadForm.php

<?PHP
namespace app\models;

use yii\base\Model;
use yii\web\UploadedFile;

/**
 * UploadForm is the model behind the upload form.
 */
class UploadForm extends Model
{
  /**
   * @var UploadedFile file attribute
   */
  public $file;

  /**
   * @return array the validation rules.
   */
  public function rules()
  {
    return [
      [['file'], 'file'],
    ];
  }
}
?>

upload.php

<?php
use yii\widgets\ActiveForm;
?>

<?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data']]) ?>

<?= $form->field($model, 'file')->fileInput() ?>

<button>Submit</button>

<?php ActiveForm::end() ?>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
图形数字验证代码
Oct 09 PHP
怎样在UNIX系统下安装php3
Oct 09 PHP
php中可能用来加密字符串的函数[base64_encode、urlencode、sha1]
Jan 16 PHP
深入apache host的配置详解
Jun 09 PHP
国外十大最流行的PHP框架排名
Jul 04 PHP
php权重计算方法代码分享
Jan 09 PHP
PHP curl 抓取AJAX异步内容示例
Sep 09 PHP
thinkphp3.2中Lite文件替换框架入口文件或应用入口文件的方法
May 21 PHP
PHP中COOKIES使用示例
Jul 26 PHP
WordPress中缩略图的使用以及相关技巧
Nov 24 PHP
php版微信公众账号第三方管理工具开发简明教程
Sep 23 PHP
Laravel框架模板继承操作示例
Jun 11 PHP
yii2实现Ueditor百度编辑器的示例代码
Nov 02 #PHP
php 调用百度sms来发送短信的实现示例
Nov 02 #PHP
Linux下 php7安装redis的方法
Nov 01 #PHP
PHP结合Ffmpeg快速搭建流媒体服务的实践记录
Oct 31 #PHP
php图片裁剪函数
Oct 31 #PHP
php+js实现裁剪任意形状图片
Oct 31 #PHP
workerman结合laravel开发在线聊天应用的示例代码
Oct 30 #PHP
You might like
php中通过正则表达式下载内容中的远程图片的函数代码
2012/01/10 PHP
php接口与接口引用的深入解析
2013/08/09 PHP
thinkphp中AJAX返回ajaxReturn()方法分析
2016/12/06 PHP
PHP全局使用Laravel辅助函数dd
2019/12/26 PHP
精解window.setTimeout()&amp;window.setInterval()使用方式与参数传递问题!
2007/11/23 Javascript
关于firefox的ElementTraversal 接口 使用说明
2010/11/11 Javascript
Extjs3.0 checkboxGroup 动态添加item实现思路
2013/08/14 Javascript
JavaScript 里的类数组对象
2015/04/08 Javascript
EasyUI加载完Html内容样式渲染完成后显示
2016/07/25 Javascript
AngularJS中update两次出现$promise属性无法识别的解决方法
2017/01/05 Javascript
薪资那么高的Web前端必看书单
2017/10/13 Javascript
使用JQuery实现图片轮播效果的实例(推荐)
2017/10/24 jQuery
详解node.js 下载图片的 2 种方式
2018/03/02 Javascript
vue引入js数字小键盘的实现代码
2018/05/14 Javascript
利用不到200行代码写一款属于你自己的js类库
2019/07/08 Javascript
js对象数组和对象的使用实例详解
2019/08/27 Javascript
ES6 Promise对象概念及用法实例详解
2019/10/15 Javascript
压缩Vue.js打包后的体积方法总结(Vue.js打包后体积过大问题)
2020/02/03 Javascript
web.py中调用文件夹内模板的方法
2014/08/26 Python
python使用分治法实现求解最大值的方法
2015/05/12 Python
python实现简单爬虫功能的示例
2016/10/24 Python
python整合ffmpeg实现视频文件的批量转换
2019/05/31 Python
python交互模式下输入换行/输入多行命令的方法
2019/07/02 Python
django多个APP的urls设置方法(views重复问题解决)
2019/07/19 Python
创建Shapefile文件并写入数据的例子
2019/11/26 Python
阿联酋电子产品购物网站:Menakart
2017/09/15 全球购物
什么是.net的Remoting技术
2016/07/08 面试题
Internal修饰符有什么含义
2013/07/10 面试题
网络技术支持面试题
2013/04/22 面试题
员工评语大全
2014/01/19 职场文书
学徒工职责
2014/03/06 职场文书
学习经验交流会主持词
2014/04/01 职场文书
2014年母亲节寄语
2014/05/07 职场文书
教师考察材料范文
2014/06/03 职场文书
接待员岗位职责
2015/02/13 职场文书
公司财务部岗位职责
2015/04/14 职场文书