首页 > 作文

yii2实现Ueditor百度编辑器的示例代码

更新时间:2023-04-06 16:47:52 阅读: 评论:0

今天在网上看了下有关图片上传的教程,历经挫折才调试好,现在把相关代码及其说明贴出来,以供初次使用的朋友们参考。

资源下载

yii2.0-ueditor下载路径:

效果演示:

安装方法:

1.下载yii2-ueditor
2.将下载的yii2-ueditor-master专科升本科 修改 ueditor (注意:修改成其他文件名请修改插件内对应的命名空间)
3.将文件方在 根目录/common/widgets 下即可

调用方法:

在backend/controllers中新建一个控制器demo加入以下代码

public function actions(){ return [ 'ueditor'=>[  'class' => 'common\widgets\ueditor\ueditoraction',  'config'=>[  //上传图片配置  'imageurlprefix' => "", /* 图片访问路径前缀 */  'imagepathformat' => "/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */  ] ] ];}

第一种调用方式:

在对应的渲染页面,即views下的页面中

<?=common\widgets\ueditor\ueditor::widget(['options'=>['initialframewidth' => 850,]])?>

options 填写配置编辑器的参数(参考ueditor官网)

第二种调用方式:

<?php $form = activeform::begin(); ?><?= $form->field($model, 'title')->textinput(['maxlength' => true]) ?><?= $form->field($model, 'content')->widget('common\widgets\ueditor\ueditor',[ 'options'=>[ 'initialframewidth' => 850, ]]) ?> ...<?php activeform::end(); ?>

yii2框架整合了百度编辑器,因为文件上传采用的是yii2自带的uploadedfile,这就难免umeditor上传不成功问题,解决问题的只需要两个操作步骤,我们来看看具体实现

创建一个 common/models/upload.php:代码为:

<?phpnamespace common\models;u yii\ba\model;u yii\web\uploadedfile;/** * uploadform is the model behind the upload 试卷质量分析form. */class upload extends model{ /** * @var uploadedfile file attribute */ public $file; /** * @return array th笔记本电脑牌子排行e validation rules. */ public function rules() { return [  [['file'], 'file'], ]; }}

需要在刚刚创建的那个控制器demo里添加actionuploadimage方法处理“富文本框的图片上传”内撤诉申请书范本容

u yii\web\uploadedfile;u common\models\upload;/** * 富文本框的图片上传 * @return array */ public function actionuploadimage() { $model = new upload(); if (yii::$app->request->ispost) {  $model->file = uploadedfile::getinstance($model, "file");  $dir = '/uploads/ued微夫人之力不及此翻译itor/';//文件保存目录  if (!is_dir($dir))  mkdir($dir);  if ($model->validate()) {  $filename = $model->file->baname . "." . $model->file->extension;  $dir = $dir."/". $filename;  $model->file->saveas($dir);  $info = [   "originalname" => $model->file->baname,   "name" => $model->file->baname,   "url" => $dir,   "size" => $model->file->size,   "type" => $model->file->type,   "state" => "success",  ];  exit(json_encode($info));  } } }

特别提醒:上述返回的$info信息中state状态只能是success,区分大小写

视图文件

<?phpu yii\widgets\activeform;?> <?= $form->field($model, 'content')->widget('common\widgets\ueditor\ueditor',[ 'options'=>[  'initialframewidth' => 1050,//宽度  'initialframeheight' => 550,//高度 ] ]) ?><div class="form-group"> <?= html::submitbutton('保存', ['class' => 'btn btn-success']) ?> </div><?php activeform::end() ?>

其中content是字段名称

关于图片上传的可以看下:

在yii2框架中使用ueditor编辑器发布文章的地址:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持www.887551.com。

本文发布于:2023-04-06 16:47:50,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/fanwen/zuowen/869069b946fc6a1aa01ef02e114477eb.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

本文word下载地址:yii2实现Ueditor百度编辑器的示例代码.doc

本文 PDF 下载地址:yii2实现Ueditor百度编辑器的示例代码.pdf

标签:路径   图片上传   编辑器   代码
相关文章
留言与评论(共有 0 条评论)
   
验证码:
Copyright ©2019-2022 Comsenz Inc.Powered by © 专利检索| 网站地图