表单基本使用

示例

Dcat\Admin\Form类用于快速生成表单页面,先来个例子,数据库中有movies

  1. CREATE TABLE `movies` (
  2. `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
  3. `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL,
  4. `director` int(10) unsigned NOT NULL,
  5. `describe` varchar(255) COLLATE utf8_unicode_ci NOT NULL,
  6. `rate` tinyint unsigned NOT NULL,
  7. `released` enum(0, 1),
  8. `release_at` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00',
  9. `created_at` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00',
  10. `updated_at` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00',
  11. PRIMARY KEY (`id`)
  12. ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

对应的数据模型为App\Models\Movie,数据仓库为App\Admin\Repositories\Movie

  1. use App\Admin\Repositories\Movie;
  2. use Dcat\Admin\Form;
  3. use Dcat\Admin\Admin;
  4. $form = Form::make(new Movie(), function (Form $form) {
  5. // 显示记录id
  6. $form->display('id', 'ID');
  7. // 添加text类型的input框
  8. $form->text('title', '电影标题');
  9. $directors = [
  10. 1 => 'John',
  11. 2 => 'Smith',
  12. 3 => 'Kate',
  13. ];
  14. $form->select('director', '导演')->options($directors);
  15. // 添加describe的textarea输入框
  16. $form->textarea('describe', '简介');
  17. // 数字输入框
  18. $form->number('rate', '打分');
  19. // 添加开关操作
  20. $form->switch('released', '发布?');
  21. // 添加日期时间选择框
  22. $form->datetime('release_at', '发布时间');
  23. // 两个时间显示
  24. $form->display('created_at', '创建时间');
  25. $form->display('updated_at', '修改时间');
  26. });

数据仓库

数据仓库(Repository)是一个可以提供特定接口对数据进行读写操作的类,通过数据仓库的引入,可以让页面的构建不再关心数据读写功能的具体实现,开发者只需要实现特定的操作接口即可轻松切换数据源。关于数据仓库的详细用法请参考文档数据仓库

表单定义

推荐使用以下方式构建表单

  1. use App\Admin\Repositories\Movie;
  2. use Dcat\Admin\Form;
  3. use Dcat\Admin\Admin;
  4. $form = Form::make(new Movie, function (Form $form) {
  5. // 显示记录id
  6. $form->display('id', 'ID');
  7. $form->select('director', '导演')->options($directors);
  8. ...
  9. });

获取当前模型数据

在闭包内可以获取到当前模型的数据(编辑)

  1. Form::make(new Movie, function (Form $form) {
  2. // 显示记录id
  3. $form->display('id', 'ID');
  4. // 获取模型数据,如果"status == 1"则显示"rate"字段
  5. if ($form->model()->status == 1) {
  6. $form->number('rate');
  7. }
  8. $form->select('director', '导演')->options($directors);
  9. ...
  10. });

自定义工具

表单右上角默认有返回和跳转列表两个按钮工具, 可以使用下面的方式修改它:

  1. $form->tools(function (Form\Tools $tools) {
  2. // 去掉跳转列表按钮
  3. $tools->disableList();
  4. // 去掉跳转详情页按钮
  5. $tools->disableView();
  6. // 去掉删除按钮
  7. $tools->disableDelete();
  8. // 添加一个按钮, 参数可以是字符串, 匿名函数, 或者实现了Renderable或Htmlable接口的对象实例
  9. $tools->append('<a class="btn btn-sm btn-danger"><i class="fa fa-trash"></i>&nbsp;&nbsp;delete</a>');
  10. });
  11. // 去除整个工具栏内容
  12. $form->disableHeader();
  13. // 也可以通过以下方式去除工具栏的默认按钮
  14. $form->disableListButton();
  15. $form->disableViewButton();
  16. $form->disableDeleteButton();

自定义复杂工具按钮

请参考文档表单动作

表单底部

使用下面的方法去掉form底部的元素

  1. $form->footer(function ($footer) {
  2. // 去掉`重置`按钮
  3. $footer->disableReset();
  4. // 去掉`提交`按钮
  5. $footer->disableSubmit();
  6. // 去掉`查看`checkbox
  7. $footer->disableViewCheck();
  8. // 去掉`继续编辑`checkbox
  9. $footer->disableEditingCheck();
  10. // 去掉`继续创建`checkbox
  11. $footer->disableCreatingCheck();
  12. });
  13. // 去除整个底部内容
  14. $form->disableFooter();
  15. // 也可以通过以下方式去底部元素
  16. $form->disableSubmitButton();
  17. $form->disableResetButton();
  18. $form->disableViewCheck();
  19. $form->disableEditingCheck();
  20. $form->disableCreatingCheck();

常用方法

表单布局

请参考表单布局

返回字段验证出错信息 (responseValidationMessages)

通过responseValidationMessages方法可以很方便的返回字段验证出错信息,而不需要使用Laravel validation功能。

普通使用

  1. protected function form()
  2. {
  3. return Form::make(new Model(), function (Form $form) {
  4. if (...) { // 验证逻辑
  5. $form->responseValidationMessages('title', 'title格式错误');
  6. // 如有多个错误信息,第二个参数可以传数组
  7. $form->responseValidationMessages('content', ['content格式错误', 'content不能为空']);
  8. }
  9. });
  10. }

在事件中使用

{tip} 此方法仅在submitted事件中可用

  1. $form->submitted(function (Form $form) {
  2. // 接收表单参数
  3. $title = $form->title;
  4. if (...) { // 验证逻辑
  5. $form->responseValidationMessages('title', 'title格式错误');
  6. // 如有多个错误信息,第二个参数可以传数组
  7. $form->responseValidationMessages('content', ['content格式错误', 'content不能为空']);
  8. }
  9. });

去掉提交按钮:

  1. $form->disableSubmitButton();

去掉重置按钮:

  1. $form->disableResetButton();

忽略掉不需要保存的字段 (ignore)

  1. $form->ignore(['column1', 'column2', 'column3']);
  2. // 取消已忽略的字段
  3. $form->removeIgnoredFields(['column1',]);

设置宽度 (width)

此处的宽度值是一个1-12之间的数字,第一个参数为 field 的宽,第二个参数为 label 的宽可省略

  1. $form->width(10, 2);

设置表单提交的action

  1. $form->action('auth/users');

判断是否是新增 (isCreating)

新增页面和保存新增数据都可以用这个方法判断

  1. if ($form->isCreating()) {
  2. ...
  3. }

判断是否是编辑 (isEditing)

编辑页面和保存编辑数据都可以用这个方法判断

  1. if ($form->isEditing()) {
  2. ...
  3. }

判断是否是删除 (isDeleting)

  1. if ($form->isDeleting()) {
  2. ...
  3. }

获取ID (getKey)

新增页面无效,必须在闭包里面使用

  1. return Form::make(new User, function (Form $form) {
  2. $id = $form->getKey();
  3. ...
  4. });

获取编辑数据 (model)

新增页面无效,必须在闭包里面使用

  1. return Form::make(new User, function (Form $form) {
  2. $username = $form->model()->xxx;
  3. ...
  4. });

获取表单提交的数据 (input)

  1. $form->saving(function (Form $form) {
  2. $username = $form->username;
  3. // 等同于
  4. $username = $form->input('username');
  5. });

修改或删除表单提交的数据

  1. $form->saving(function (Form $form) {
  2. // 修改
  3. $form->input('username', 'Marry');
  4. // 或
  5. $form->username = 'Marry';
  6. // 删除
  7. $form->deleteInput('username');
  8. });

获取最终保存的数据 (updates)

此方法仅在saved回调有效。

  1. $form->saved(function (Form $form) {
  2. $data = $form->updates();
  3. });

页面跳转 (redirect)

跳转到指定页面,此方法仅在表单回调事件内可用

  1. // 跳转并提示成功信息
  2. $form->saved(function (Form $form) {
  3. return $form->redirect('auth/user', '保存成功');
  4. });
  5. // 跳转并提示错误信息
  6. $form->saving(function (Form $form) {
  7. return $form->redirect('auth/user', [
  8. 'message' => '系统错误',
  9. 'status' => false,
  10. ]);
  11. });

显示确认弹窗 (confirm)

{tip} Since v1.6.5

点击表单提交按钮时弹出确认弹窗,如果是在普通数据表单中

  1. $form->confirm('您确定要提交表单吗?', 'content');

设置外层容器 (wrap)

  1. // 更改表格外层容器
  2. $form->wrap(function (Renderable $view) {
  3. $tab = Tab::make();
  4. $tab->add('示例', $view);
  5. $tab->add('代码', $this->code(), true);
  6. return $tab;
  7. });