Skip to content

Latest commit

 

History

History
233 lines (179 loc) · 5.47 KB

form.md

File metadata and controls

233 lines (179 loc) · 5.47 KB

表单

Encore\Admin\Widgets\Form类用来快速构建表单:

$form = new Form();

$form->action('example');

$form->email('email')->default('[email protected]');
$form->password('password');
$form->text('name', '输入框');
$form->url('url');
$form->color('color');
$form->map('lat', 'lng');
$form->date('date');
$form->json('val');
$form->dateRange('created_at', 'updated_at');

echo $form->render();

Form::__construct($data = [])生成一个form对象,如果传入了$data参数,$data数组中的元素将会按照key对应填入form对应name的表单中。

Form::action($uri)方法用来设置表单提交地址。

Form::method($method)方法用来设置form表单的提交方法,默认为POST方法。

表单元素

Form对象通过魔术方法__call()实现了近30种form元素的实现,可以通过简短的调用添加表单元素:

文本输入框

$form->text($column, [$label]);

// 添加提交验证规则
$form->text($column, [$label])->rules('required|min:10');

select选择框

$form->select($column[, $label])->options([1 => 'foo', 2 => 'bar', 'val' => 'Option name']);

多选框

$form->multipleSelect($column[, $label])->options([1 => 'foo', 2 => 'bar', 'val' => 'Option name']);

textarea输入框:

$form->textarea($column[, $label]);

radio选择

$form->radio($column[, $label])->values(['m' => 'Female', 'f'=> 'Male'])->default('m');

checkbox选择

values()方法用来设置选择项:

$form->checkbox($column[, $label])->values([1 => 'foo', 2 => 'bar', 'val' => 'Option name']);

email个数输入框

$form->email($column[, $label]);

密码输入框

$form->password($column[, $label]);

url输入框

$form->url($column[, $label]);

ip输入框

$form->ip($column[, $label]);

电话号码输入框

$form->mobile($column[, $label])->format('999 9999 9999');

颜色选择框

$form->color($column[, $label])->default('#ccc');

时间输入框

$form->time($column[, $label]);

// 设置时间格式,更多格式参考http://momentjs.com/docs/#/displaying/format/
$form->time($column[, $label])->format('HH:mm:ss');

日期输入框

$form->date($column[, $label]);

// 设置日期格式,更多格式参考http://momentjs.com/docs/#/displaying/format/
$form->date($column[, $label])->format('YYYY-MM-DD');

日期时间输入框

$form->datetime($column[, $label]);

// 设置日期格式,更多格式参考http://momentjs.com/docs/#/displaying/format/
$form->datetime($column[, $label])->format('YYYY-MM-DD HH:mm:ss');

时间范围选择框

$startTime$endTime为开始和结束时间字段:

$form->timeRange($startTime, $endTime, 'Time Range');

日期范围选框

$startDate$endDate为开始和结束日期字段:

$form->dateRange($startDate, $endDate, 'Date Range');

时间日期范围选择框

$startDateTime$endDateTime为开始和结束时间日期:

$form->datetimeRange($startDateTime, $endDateTime, 'DateTime Range');

货币输入框

$form->currency($column[, $label]);

// 设置单位符号
$form->currency($column[, $label])->symbol('');

数字输入框

$form->number($column[, $label]);

比例输入框

$form->rate($column[, $label]);

图片上传

可以使用压缩、裁切、添加水印等各种方法,请参考[Intervention],图片上传目录在文件config/admin.php中的upload.image中配置,如果目录不存在,需要创建该目录并开放写权限。:

$form->image($column[, $label]);

// 修改图片上传路径和文件名
$form->image($column[, $label])->move($dir, $name);

// 剪裁图片
$form->image($column[, $label])->crop(int $width, int $height, [int $x, int $y]);

// 加水印
$form->image($column[, $label])->insert($watermark, 'center');

文件上传

文件上传目录在文件config/admin.php中的upload.file中配置,如果目录不存在,需要创建该目录并开放写权限。

$form->file($column[, $label]);

// 修改文件上传路径和文件名
$form->file($column[, $label])->move($dir, $name);

// 并设置上传文件类型
$form->file($column[, $label])->rules('mimes:doc,docx,xlsx');

地图控件

地图控件,用来选择经纬度,$latitude, $longitude为经纬度字段,laravel的locale设置为zh_CN的时候使用腾讯地图,否则使用Google地图:

$form->map($latitude, $longitude, $label);

// 使用腾讯地图
$form->map($latitude, $longitude, $label)->useTencentMap();

// 使用Google地图
$form->map($latitude, $longitude, $label)->useGoogleMap();

滑动选择控件

可以用来数字类型字段的选择,比如年龄:

$form->slider($column[, $label])->options(['max' => 100, 'min' => 1, 'step' => 1, 'postfix' => 'years old']);

富文本编辑框

$form->editor($column[, $label]);

json编辑框

$form->json($column[, $label]);

隐藏域

$form->hidden($column);

开关选择

onoff对用开关的两个值10:

$form->switch($column[, $label])->states(['on' => 1, 'off' => 0]);

显示字段

只显示字段,不做任何操作:

$form->display($column[, $label]);

分割线

$form->divide();