FormBuilder 是一個開源的PHP表單生成器,能夠快速生成現代化的form表單。還能夠配合開源項目 xaboy/form-create 生成任何 Vue 組件php
- PHP >= 5.4
使用 composer:github
$ composer require xaboy/form-builder:~2.0
複製代碼
文檔bash
- IView
- ElementUI
- 內置17種經常使用的表單組件
- 支持表單驗證
- 支持生成任何 Vue 組件
- 支持柵格佈局
- 能夠配合 form-create 生成更復雜的表單
以 ElementUI 爲例,用法以下:markdown
use FormBuilder\Factory\Elm; $action = '/save.php'; $method = 'POST'; $input = Elm::input('goods_name', '商品名稱')->required(); $textarea = Elm::textarea('goods_info', '商品簡介'); $switch = Elm::switches('is_open', '是否開啓')->activeText('開啓')->inactiveText('關閉'); //建立表單 $form = Elm::form($action)->setMethod($method); //添加組件 $form->setRule([$input, $textarea]); $form->append($switch); //生成表單頁面 echo $formHtml = $form->view(); 複製代碼
全部內置組件都支持 required 驗證app
$input = Elm::input('goods_name','商品名稱'); //必填 $input->required(); 複製代碼
建立一個必填的驗證規則composer
//input 組件值得類型爲 string $validate = Elm::validateStr(); $validate->required()->message('請填寫商品名稱'); $input->appendValidate($validate); //$input->appendValidates([$validate]); //$input->validate([$validate]) //這個會覆蓋剛剛添加的必填規則 複製代碼
全部內置組件都支持經過 createValidate 方法獲取組件的驗證規則,注意:一個組件的驗證規則可能有多個類型,要把組件全部的規則配置完後再獲取oop
$start = date('Y-m-d', strtotime('- 10day')); $end = date('Y-m-d', time()); $dateRange = Elm::dateRange('start_time','時間區間', $start, $end); $validate = $dateRange->createValidate(); 複製代碼
$validate->range(1,10); 複製代碼
$validate->min(1); 複製代碼
$validate->max(10); 複製代碼
$validate->length(10); 複製代碼
$list = [1,2,3,4]; $validate->enum($list); 複製代碼
$validate->pattern('^[A-Z]+$'); 複製代碼
$validate->message('輸入有誤'); 複製代碼
string
類型$validate = Elm::validateStr(); //email $validate = Elm::validateEmail(); //url $validate = Elm::validateUrl(); 複製代碼
array
類型$validate = Elm::validateArr();
複製代碼
int
類型$validate = Elm::validateInt();
複製代碼
float
類型$validate = Elm::validateFloat();
複製代碼
float|int
類型$validate = Elm::validateNum();
複製代碼
Date
類型例如DatePicker
,TimePicker
佈局
$validate = Elm::validateDate();
複製代碼
object
類型$validate = Elm::validateObject();
複製代碼
$validate = Elm::validateEnum()->enum(['1','2','3']); 複製代碼
$validate = Elm::validateHex();
複製代碼
值發生變化時觸發驗證,默認ui
組件失去焦點時觸發
表單提交時觸發