在Yii2框架中创建带有上传功能的表单须要利用Yii2内置的`ActiveForm`类,同时还须要在模型中定义相应的规则和在掌握器中处理文件上传。下面是一个大略的例子,假设你想要创建一个包含文件上传功能的表单。
1. 创建模型(models/YourModel.php):
<?php
namespace app\models;
use yii\base\Model;
use yii\web\UploadedFile;
class YourModel extends Model
{
public $file; // 属性用于吸收上传的文件
public function rules()
{
return [
[[39;file'], 'file', 'skipOnEmpty' => false, 'extensions' => 'png, jpg, jpeg'],
];
}
}
2. 创建掌握器(controllers/YourController.php):
<?php
namespace app\controllers;
use Yii;
use yii\web\Controller;
use app\models\YourModel;
use yii\web\UploadedFile;
class YourController extends Controller
{
public function actionYourForm()
{
$model = new YourModel();
if (Yii::$app->request->isPost) {
$model->file = UploadedFile::getInstance($model, 'file');
if ($model->file && $model->validate()) {
$uploadPath = Yii::getAlias('@app/uploads/');
$model->file->saveAs($uploadPath . $model->file->baseName . '.' . $model->file->extension);
// 处理文件上传后的逻辑,可以保存文件路径到数据库或其他操作
// 例如:$model->file_path = $uploadPath . $model->file->baseName . '.' . $model->file->extension;
}
}
return $this->render('yourForm', ['model' => $model]);
}
}
3. 创建视图文件(views/your-controller/yourForm.php):
<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
?>
<?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data']]); ?>
<?= $form->field($model, 'file')->fileInput() ?>
<div class="form-group">
<?= Html::submitButton('Submit', ['class' => 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
在这个例子中,`models/YourModel.php` 中定义了一个模型,个中包含一个用于吸收上传文件的属性,并利用`rules`方法设置了文件上传的规则。`controllers/YourController.php` 中的`actionYourForm`方法处理了文件上传的逻辑,将上传的文件保存到指定目录。视图文件`views/your-controller/yourForm.php` 利用`ActiveForm`创建了带有文件上传功能的表单。
效果如下:
如果你希望利用第三方的js前端UI框架,可以在布局文件中引入相应的CSS和JS文件,例如,如果你想利用Bootstrap,可以在布局文件中添加以下代码:
<?php
use yii\helpers\Html;
use yii\bootstrap\NavBar;
use yii\bootstrap\Nav;
/ @var $this \yii\web\View /
/ @var $content string /
\yii\bootstrap\BootstrapAsset::register($this);
$this->beginPage();
?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
<meta charset="<?= Yii::$app->charset ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?= Html::csrfMetaTags() ?>
<title><?= Html::encode($this->title) ?></title>
<?php $this->head() ?>
</head>
<body>
<?php $this->beginBody(); ?>
<div class="wrap">
<?php
NavBar::begin([
'brandLabel' => 'My Yii Application',
'brandUrl' => Yii::$app->homeUrl,
'options' => [
'class' => 'navbar-inverse navbar-fixed-top',
],
]);
echo Nav::widget([
'options' => ['class' => 'navbar-nav navbar-right'],
'items' => [
['label' => 'Home', 'url' => ['/site/index']],
// other menu items...
],
]);
NavBar::end();
?>
<div class="container">
<?= $content ?>
</div>
</div>
<?php $this->endBody(); ?>
</body>
</html>
<?php $this->endPage(); ?>
在这个例子中,我利用了Yii2的Bootstrap扩展,通过`\yii\bootstrap\BootstrapAsset::register($this);`来引入Bootstrap的CSS和JS文件。你可以根据自己的须要引入其他第三方前端UI框架的文件。