README

又一个 Bootstrap 4 表单渲染器和自定义表单组件，为 Nette 框架 提供。灵感来源于 contributte/forms、nextras/forms 和 Kdyby/BootstrapFormRenderer。

待办事项

• 编写测试

要求

• PHP 7.3

安装

使用 composer 安装

composer require tvaliasek/yabsform

在 *.neon 配置中注册扩展。

extensions:
    yabsform.controls: YABSForm\DI\FormControlsExtension
    yabsform.formFactory: YABSForm\DI\FormFactoryExtension
    yabsform.formMacros: YABSForm\DI\FormMacrosExtension

使用方法

最简单的方法是使用提供的表单工厂，它创建 Form 实例并将渲染器设置为 BootstrapFormRenderer。

/* example in presenter */

/**
* @inject
* @var \YABSForm\Factories\BootstrapFormFactory
*/
public $formFactory;

protected function createComponentExampleForm(): Form
{
    $form = $this->formFactory->create();
    /* ... add controls, callbacks etc. */
    return $form;
}

/* example in component or service */

/**
* @var \YABSForm\Factories\BootstrapFormFactory
*/
private $formFactory;

public function __construct(\YABSForm\Factories\BootstrapFormFactory $formFactory)
{
    $this->formFactory = $formFactory
}

渲染器中的自定义方法

渲染器提供了一些方法，允许对渲染输出的常见修改。

$renderer = $form->getRenderer();

// Sets default css class names for submit inputs
$renderer->setSubmitButtonClassnames('btn-lg btn-primary');

// Sets default css class names for buttons other than submit inputs
$renderer->setButtonClassnames('btn-secondary');

// Disables dismissibility of form errors presented as bootstrap alerts
$renderer->disableDismissibleFormErrors()

// Set globally size of controls
$renderer->setControlSize('lg')

// Set globally columns for labels and for controls (in vertical render mode)
$renderer->setLabelColumns(12, null, null, 4, null)
$renderer->setControlColumns(12, null, null, 8, null)

自定义表单宏

此包还提供了一些自定义宏，以更好地控制表单布局。所有这些宏都是不成对的，并且不接受更多参数。

{* in latte template *}
{form exampleForm}
    {* renders form errors *}
    {bsErrors}
    {* renders form own errors *}
    {bsOwnErrors}
    
    {* renders whole form-group with input, feedback and label *}
    {bsPair exampleInput}
    
    {* renders only label*}
    {bsLabel exampleInput}
    
    {* renders only input *}
    {bsInput exampleInput}
{/form}

自定义 Bootstrap 表单元素

可用的是

• CustomCheckbox - 可渲染为开关
• CustomCheckboxList - 可渲染为开关
• CustomMultiSelect
• CustomRadioList
• CustomRange
• CustomSelect
• CustomUpload - 有关显示选中文件名称的说明，请参阅 bootstrap 文档
• DatePicker 和 DateTimePicker 在此处单独存储 Nextras Forms Fork

为了正确显示无效反馈消息，您应包含以下附加样式

<style>
    .__yabsform-is-invalid ~ .invalid-feedback,
    .custom-range.is-invalid ~ .invalid-feedback,
    .custom-file.is-invalid ~ .invalid-feedback,
    .custom-control.is-invalid ~ .invalid-feedback{
        display: block;
    }
</style>

表单中使用示例

$form->addCustomCheckbox('switch', 'Custom checkbox switch')
    ->renderAsSwitch(true);
$form->addCustomCheckbox('custom', 'Custom checkbox');

$form->addCustomCheckboxList('customList', 'Custom checkbox list', [
    'first' => 'first item',
    'second' => 'second item',
    'third' => 'third item'
]);
$form->addCustomCheckboxList('customSwitchesList', 'Custom switches checkbox list', [
    'first' => 'first item',
    'second' => 'second item',
    'third' => 'third item'
])->renderAsSwitches(true);

$form->addCustomRadioList('customRadioList', 'Custom radio list', [
    'first' => 'first item',
    'second' => 'second item',
    'third' => 'third item'
]);

$form->addCustomSelect('customSelect', 'Custom select', [
    'first' => 'first item',
    'second' => 'second item',
    'third' => 'third item'
]);

$form->addCustomMultiSelect('customMultiselect', 'Custom multiselect', [
    'first' => 'first item',
    'second' => 'second item',
    'third' => 'third item'
]);

$form->addCustomUpload('customUpload', 'Custom upload')
    ->setBrowseCaption('Procházet');

$form->addCustomRange('customRange', 'Custom range', 0, 2, .5)
    ->setRequired(true);