第一步:搭建上传类基础工作,具体请看:http://www.yiichina.com/tutorial/328
第二步:建站一个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
<?phpnamespace 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
<?phpnamespace 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
<?phpuse yii\widgets\activeform;?><?php $form = activeform::begin(['options' => ['enctype' => 'multipart/form-data']]) ?><?= $form->field($model, 'file')->fileinput() ?><button>submit</button><?php activeform::end() ?>
,有大量免费的yii入门教程,欢迎大家学习!
以上就是yii2 怎么上传图片的详细内容。