Yii2上传图片插件使用
例子:
1.在表单中:
<?php $form = \yii\widgets\ActiveForm::begin([ 'options'=>[ 'class' => 'form-horizontal', 'enctype' => 'multipart/form-data' ], 'fieldConfig' => [ 'template' => '{input}{error}', 'options' => ['class' => 'form-field'], ], ]); ?>
注意:上传图片必须修改表单提交必须是以二进制数据流的形式;必须配置
'enctype' => 'multipart/form-data'
<?= $form->field($model, 'wms_check_certificate')->label("差异清单截图")->widget(\kartik\widgets\FileInput::className(), [ 'options' => [ 'accept' => 'image/jpg, image/jpeg, image/png, image/gif', 'multiple' => false, ], 'pluginOptions' => [ 'previewFileType' => 'image', 'initialPreview' => !empty($model->wms_check_certificate) ? $model->wms_check_certificate : "", 'initialPreviewConfig'=>[], 'overwriteInitial'=>true, 'initialPreviewAsData' => true, 'uploadUrl' => \yii\helpers\Url::toRoute(['upload']), 'uploadExtraData' => ['id'=>$model->id], 'allowedFileExtensions' => ['jpg', 'png','gif', 'jpeg'], 'uploadAsync' => true, 'minFileCount' => 0, 'maxFileCount' => 1, 'showRemove' => true, 'showUpload' => true, 'showBrowse' => true, 'showPreview' => true, 'showCaption' => false, 'browseOnZoneClick' => true, 'fileActionSettings' => [ 'showZoom' => true, 'showUpload' => true, 'showRemove' => true, ], ], 'pluginEvents' => [ "fileclear" => "function() { $('#wmscheck-wms_check_certificate').val(''); }", "fileuploaded" => "function (event, data, id, index) { console.log(data); }", ], ]) ?>
注意:
'accept' => 'image/jpg, image/jpeg, image/png, image/gif', 指的是上传的文件的格式必须是jpg,png和gif
'multiple' => false,指的是不支持上传多个文件
'previewFileType' => 'image',指的是上传的文件必须是图片
'initialPreview' => !empty($model->wms_check_certificate) ? $model->wms_check_certificate : "",指的是刚进入页面时默认显示的文件
'uploadUrl' => \yii\helpers\Url::toRoute(['upload']),指的是上传文件的ur地址
'uploadExtraData' => ['id'=>$model->id],指的是上传文件时附带的数据
'allowedFileExtensions' => ['jpg', 'png','gif', 'jpeg'],指的是支持的文件后缀
'uploadAsync' => true,指的是是否以异步形式上传
'showUpload' => true,是否显示上传按钮
'showBrowse' => true,是否显示打开文件对话框按钮
'showRemove' => true,是否显示移除按钮
'showCaption' => false,是否显示方法查看按钮
2.在后台处理上传:
public function actionUpload(){ $id = $_REQUEST['id']; if(!empty($_FILES['WmsCheck']['tmp_name']['wms_check_certificate'])){ $wms_check_certificate = \common\models\Base::uploadCloud($_FILES['WmsCheck']['tmp_name']['wms_check_certificate'], $_FILES['WmsCheck']['name']['wms_check_certificate'], 'wms'); $model = \core\models\WmsCheck::findOne(['id'=>$id]); if (empty($model)){ echo json_encode(['msg'=>false]); }else{ $model->wms_check_certificate = $wms_check_certificate; $save_handler = $model->save(false); echo json_encode(['msg'=>$save_handler]); } }else{ echo json_encode(['msg'=>false]); } }
Yii2上传图片插件使用的更多相关文章
- 如何写一个Js上传图片插件。
项目里面需要一个上传图片的插件,找了半天没有找到满意的,算了 不找了,自己写一个吧,顺便复习一下js方面的知识.完成之后效果还不错,当然还要继续优化,源码在最后. 介绍一种常见的js插件的写法 ; ( ...
- Typora-yes:typora最舒适的使用-优化主题+图床服务+自动上传图片插件
转载注明出处:https://www.cnblogs.com/nreg/p/11992678.html,谢谢 开源项目下载:https://github.com/nreg/typora-yes 云盘: ...
- jquery上传图片插件plupload
官方网站:http://plupload.com/ jquery.plupload.queue插件,是上传图片组件很强大的插件.plupload 前端根据浏览器不同选择使用Html5. Gears, ...
- yii2 开源插件与系统
yii2干货集:https://github.com/forecho/awesome-yii2 商城 samdark/yii2-shop composer global require "f ...
- ssi-uploader上传图片插件,点击选择文件按钮自动提交表单解决办法
先介绍一下这款插件,然后再谈使用中可能遇到的问题 ssi-uploader是一个JQuery的图片上传插件,界面比较美观 github地址:https://github.com/ssbeefeater ...
- window yii2 安装插件 报yiisoft/yii2 2.0.x-dev requires ext-mbstring错
Problem 1 - yiisoft/yii2 2.0.x-dev requires ext-mbstring * -> the requested PHP extens ion mbstri ...
- yii2: 上传图片,生成目录
1.单个文件上传 首先建立一个模型models/UploadForm.php,内容如下 namespace app\models; use yii\base\Model; use yii\web\Up ...
- vue封装原生的可预览裁剪上传图片插件H5,PC端都可以使用
思路:1.先做出一个上传的图片的上传区 <!-- 上传区 --> <label for="fileUp"> <div class="upBo ...
- JQuery 复制粘贴上传图片插件(textarea 和 tinyMCE)
开源地址:https://github.com/yuezhongxin/paste-upload-image.js 支持 Ctrl+C/Ctrl+V 上传,支持拖拽上传,也支持 QQ/微信截图上传. ...
随机推荐
- 【转】VMware 14 Pro安装mac os 10.12
一.准备工作 [1]资源下载 VMware Workstation Pro 14 已安装或自行安装 Unlocker (链接: https://pan.baidu.com/s/1dG5jkuH 密码: ...
- 【转】bios与CMOS有什么区别
正确的解释应该是: BIOS是软件.是程序! CMOS是芯片.是硬件! 实际上我们是通过BIOS这个程序,去设置CMOS里的参数的. CMOS是一块芯片,集成在主板上,里面保存着重要的开机参数,而保存 ...
- 003_Git & Gitlab 使用指南
2016-02-23 | 9,129字 | 分类于 工具 | 3条评论 去年小组在从 SVN 和 TFS 迁移到 Git 的过程中整理了这份文档,面向的用户是对 Git 和 SV ...
- rabbitMQ常用方法说明 – 6中工作模式及关键点
首先,RabbitMQ解决什么问题? 1)信息的发送者和接收者如何维持连接,如果一方的连接中断,这期间的数据如何防止丢失? 2)如何降低发送者和接收者的耦合度? 3)如何让Priority高的接收者先 ...
- ENQ: KO - FAST OBJECT CHECKPOINT tips
ENQ: KO - FAST OBJECT CHECKPOINT tips Question: What does the wait event ENQ: KO - FAST OBJECT CHECK ...
- idea 修改设置 检测方式为 es6
intellij idea 14不支持ES6语法!javascript 文件内到处飘红 file>settings>Lauguages & Frameworks>javasc ...
- java 基础04 重写
- 如果IBM再给我一次实习机会
2014年,我拿到了IBM斯图加特R&D的实习机会.在连续被索尼和博世拒掉之后,这个实习对我来说弥足珍贵.我学的是通信专业,在这之前与编程相关的活动只有一学期的安卓Lab,还是靠抱队友大腿才及 ...
- 从 0 到 1 实现 React 系列 —— 3.生命周期和 diff 算法
看源码一个痛处是会陷进理不顺主干的困局中,本系列文章在实现一个 (x)react 的同时理顺 React 框架的主干内容(JSX/虚拟DOM/组件/生命周期/diff算法/setState/ref/. ...
- C#.NET 大型通用信息化系统集成快速开发平台 4.1 版本 - 访问记录功能改进
当用户数据非常庞大时需要一个功能,就是统计各种账户的访问系统的情况,用户数量的各种参数需要让管理者心里有个数. 1:信息系统中有多少有效账户?可以很方便能知道具体个数,让管理者心里有个数. 2:某个公 ...