a2design-inc/laravel-form-builder

为Laravel框架的表单构建器

v0.2.2 2017-09-14 10:32 UTC

This package is not auto-updated.

Last update: 2024-09-15 02:16:56 UTC


README

Laravel插件,用于快速创建具有Bootstrap支持的表单。

您可以在不编写任何代码的情况下,根据模型实体显示验证错误、旧输入值和表单上下文,具有很高的灵活性。

example_image

目录

快速示例

您的代码

{!! Form::create('ArticleController@update', $article) !!}
    {!! Form::input('name', 'Name') !!}
    {!! Form::buttonGroup() !!}
        {!! Form::buttonLink('Cancel', '/') !!}
        {!! Form::reset() !!}
        {!! Form::submit() !!}
    {!! Form::buttonGroupEnd() !!}
{!! Form::end() !!}

输出

<form method="post" action="/article/1" id="update-article" class="form-horizontal">

    <input type="hidden" name="_token" value="CZLvWLRwqvjvZIwiaRcMj0JxyIwvpZ0nZ5y4StwO"> 
    <input type="hidden" name="_method" value="PUT"> 

    <div class="form-group">
        <label for="update-article-name" class="col-md-4 control-label">
            Name
        </label>
        <div class="col-md-6">
            <input id="update-article-name" name="name" value="Some name" class="form-control">
        </div>
    </div>
    
    <div class="form-group">
        <div class="col-md-6 col-md-offset-4">
        
            <a id="update-article-cancel" href="/" class="btn btn-primary">
                Cancel
            </a>
            
            <button id="update-article-reset" type="reset" class="btn btn-primary">
                Reset
            </button>
            
            <button id="update-article-submit" type="submit" class="btn btn-primary">
                Submit
            </button>
            
        </div>
    </div>
</form>

当然,您还可以禁用Bootstrap,设置全局配置,编辑模板等!请参阅以下内容。

如何安装

安装包

composer require a2design-inc/laravel-form-builder

注册提供者(config/app.php)

A2design\Form\FormServiceProvider::class,

以及别名

'Form' => A2design\Form\FormFacade::class,

发布包资源(如果需要更改配置文件或模板)

php artisan vendor:publish

自定义

example_image

参数

您可以为每个元素指定许多附加参数

{!! Form::create('', null, [

    //set custom method url
    'url' => 'http://google.com',
    
    //your class
    'class' => 'my-form',
    
    //etc
    
]) !!}

请参阅参数完整列表

模板编辑

此包使用Laravel Blade模板的所有表单元素。请随意自定义您所需的内容。

别忘了发布包资源

php artisan vendor:publish

配置

编辑config/form.php文件以更改全局设置。别忘了发布包资源

php artisan vendor:publish

请参阅配置完整列表

禁用Bootstrap/Grid

您可以通过$parameters或全局在配置文件中移除某些类或包装器。您还可以重新定义网格列。

或者您可以使用同时禁用几个参数的快捷方式

     //remove all bootsrap classes
     'bootstrap' => false,
     //or just show without grid
     'use-grid' => false,

示例

Bootstrap

    <div class="container">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <div class="panel panel-default">
                    <div class="panel-heading">Form</div>
                    <div class="panel-body">
                    
                        {!! Form::create('ArticleController@update', $article) !!}
                            {!! Form::input('name', 'Name') !!}
                            {!! Form::buttonGroup() !!}
                                {!! Form::buttonLink('Cancel', '/') !!}
                                {!! Form::submit() !!}
                            {!! Form::buttonGroupEnd() !!}
                        {!! Form::end() !!}
                        
                    </div>
                </div>
            </div>
        </div>
    </div>

带有标签的复选框位于不同列中,而不是紧挨着

    {!! Form::checkbox('field', 'Field', ['label' => true]) !!}

复选框行

    {!! Form::inputGroup(['checkbox-label-class' => 'checkbox-inline']) !!}
        {!! Form::checkbox('foo', 'Foo') !!}
        {!! Form::checkbox('bar', 'Bar') !!}
    {!! Form::inputGroupEnd() !!}

带有整体标签的复选框行,位于分离的列中

    {!! Form::inputGroup([
        'checkbox-label-class' => 'checkbox-inline',
        'label-text' => 'test',
    ]) !!}
        {!! Form::checkbox('foo', 'Foo') !!}
        {!! Form::checkbox('bar', 'Bar') !!}
    {!! Form::inputGroupEnd() !!}

按钮行

    {!! Form::buttonGroup(['label-text' => 'Some label']) !!}
        {!! Form::buttonLink('Cancel', '/') !!}
        {!! Form::reset() !!}
        {!! Form::submit() !!}
    {!! Form::buttonGroupEnd() !!}

必填输入星号

    .form-group.required .control-label:after {
        content: "*";
        color: red;
    }

帖子链接

    {!! Form::postLink('ArticleController@destroy', 'Delete', $article) !!}

单选按钮

    {!! Form::radio('field', 'Select the value', [
        'inline' => true,
        'options' => [
            '1' => 'First',
            '2' => 'Second',
        ]
    ]) !!}

参数完整列表

配置完整列表

方法列表

元素

  • Form::create($action = '', $entity = null, $parameters = [])
  • Form::end()
  • Form::input($name, $label = '', $parameters = [])
  • Form::hidden($name, $parameters = [])
  • Form::buttonGroup($parameters = [])
  • Form::buttonGroupEnd()
  • Form::inputGroup($parameters = [])
  • Form::inputGroupEnd()
  • Form::button($text = '提交', $parameters = [])
  • Form::buttonLink($text = '取消', $link = '/', $parameters = [])
  • Form::checkbox($name, $label = '', $parameters = [])
  • Form::postLink($action = '', $text = '', $entity = null, $parameters = [])
  • Form::radio($name, $label = '', $parameters = [])
  • Form::textarea($name, $label = '', $parameters = [])
  • Form::select($name, $label = '', $parameters = [])

快捷方式

等于input()带有"type"参数的input()

  • Form::text() - input()别名
  • Form::password()
  • Form::color()
  • Form::date()
  • Form::datetime()
  • Form::datetimeLocal()
  • Form::email()
  • Form::number()
  • Form::range()
  • Form::search()
  • Form::tel()
  • Form::time()
  • Form::url()
  • Form::month()
  • Form::week()
  • Form::file()

其他

  • Form::reset() - Form::button()带有type reset
  • Form::submit() - Form::button()别名
  • Form::text() - Form::textarea()别名

测试

如果您是贡献者,别忘了为任何更新运行/编写测试!

example_image