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/微信截图上传. ...
随机推荐
- 联想Y700安装显卡驱动和CUDA8.0
一显卡驱动安装 1 安装驱动安装软件 2 自动检测下载对应版本驱动 3下载完成后,点击开始,解压出来临时安装文件 由于是临时安装文件,退出就会关闭 4所以在没有关闭情况下,打开重新打开一次setup, ...
- (四)surging 微服务框架使用系列之网关 转载
一.什么是API网关 API网关是一个服务器,是系统对外的唯一入口.API网关封装了系统内部架构,为每个客户端提供一个定制的API.API网关方式的核心要点是,所有的客户端和消费端都通过统一的网关接入 ...
- UINavigationController - BNR
继续上篇UITableView的编辑操作. 当你初始化一个UINavigationController对象时,它将拥有一个根视图控制器,即UIViewController.根视图控制器一直存在于sta ...
- Java正则表达式初探(一)
好多同学们总是听别人说起正则表达式这个东西,也有很多用接触到实际使用过.但是相信有很大一部分人是在用的时候采取网站上搜索,拿一个一知半解的别人写的例子过来,简单测试下功能可用,就OK了.正则表达式那晦 ...
- Go源码编译安装
参考文档1:https://www.cnblogs.com/majianguo/p/7258975.html 参考文档2:http://www.loongson.cn/news/company/456 ...
- 数组去重--ES5和ES6
思路:把去重后的数组放到一个空数组中 ES5实现: function uni(arr) { var result = []; for (var i=0;i<arr.length;i++) { i ...
- vue开发中regeneratorRuntime is not defined
我的项目是用vue提供的vue-cil脚手架生成的项目,但是当我在项目中使用async/await,编译代码的的时候报了regeneratorRuntime is not defined的错,我查过资 ...
- 学习用Node.js和Elasticsearch构建搜索引擎(2):一些检索命令
1.Elasticsearch搜索数据有两种方式. 一种方式是通过REST请求URI,发送搜索参数: 另一种是通过REST请求体,发送搜索参数.而请求体允许你包含更容易表达和可阅读的JSON格式.这个 ...
- c++入门之出话指针和地址。
指针和地址是c和c++中重要的概念,在此,对指针做以下几方面的总结: new和delete: ]; point[] = ; point[] = ; point[] = ; cout << ...
- MySql实现分页查询的SQL,mysql实现分页查询的sql语句
一:分页需求: 客户端通过传递start(页码),limit(每页显示的条数)两个参数去分页查询数据库表中的数据,那我们知道MySql数据库提供了分页的函数limit m,n,但是该函数的用法和我们的 ...