doode/laravel-formbuilder

Laravel 包,用于通过 jQuery 表单构建器创建拖放表单构建器

安装: 274

依赖者: 0

建议者: 0

安全: 0

星标: 8

关注者: 1

分支: 0

开放问题: 1

语言:JavaScript

1.0.1 2021-08-04 07:19 UTC

This package is auto-updated.

Last update: 2024-09-19 16:05:43 UTC


README

这是一个 Laravel 包,用于使用 JQuery 表单构建器 创建拖放表单构建器。

欢迎所有贡献!(但请先开始讨论,以确保 PR 有根据)

截图

alt text

表单字段以 JSON 格式保存并存储在您的数据库中。您的网站成员可以创建、编辑和删除表单。表单属于创建它们的用户,每个表单都有一个唯一的链接,可以公开共享。

表单的 JSON 版本可用于渲染表单供用户填写。

示例 JSON 表单

[{"type":"header","subtype":"h1","label":"Demo Form 01"},{"type":"paragraph","subtype":"p","label":"This demo form is a potluck sign-up sheet"},{"type":"text","label":"Name","className":"form-control","name":"name","subtype":"text"},{"type":"radio-group","label":"Food Category","name":"foodcategory","other":true,"values":[{"label":"Appetizer","value":"Appetizer"},{"label":"Beverage","value":"Beverage"},{"label":"Salad","value":"Salad"},{"label":"Main","value":"Main"},{"label":"Dessert","value":"Dessert"}]},{"type":"number","label":"How many will it serve","className":"form-control","name":"numberserved","min":"1","max":"50","step":"1"},{"type":"text","label":"Dish Name","className":"form-control","name":"dishname","subtype":"text"},{"type":"checkbox-group","label":"Dietary Restrictions","description":"Which of the following does your dish contain?","name":"dietaryrestrictions","values":[{"label":"Alcohol","value":"Alcohol"},{"label":"Carbs","value":"Carbs"},{"label":"Dairy","value":"Dairy"},{"label":"Egg","value":"Egg"},{"label":"Fish","value":"Fish"},{"label":"Gluten","value":"Gluten"}]},{"type":"textarea","label":"Comment","className":"form-control","name":"comment","subtype":"textarea"}]

表单权限选项

  • 公开 - 任何人都可以提交表单而无需身份验证
  • 私有 - 只有您的网站经过身份验证的成员可以访问表单。为用户提供编辑他们之前提交的选项。

要求

composer require laravel/ui
php artisan ui bootstrap --auth

如果您正在寻找一个可管理的云主机,易于创建 Laravel 网站,那么我强烈推荐 Linux Zone。在 Linux Zone,您可以自由地以任何方式管理您的文件和数据库。

随包包含的依赖项

路线图

此自定义包安装需要几个步骤,但我会尽量使其尽可能简单。

第一步

手动编辑您的 composer.json 文件,或者只需输入

composer require doode/laravel-formbuilder

第二步

确保您已安装所有依赖项

composer install

注意:该包将自动使用 Laravel 的包发现功能(版本 6 及以上)注册自身。这意味着您不需要更新您的 config/app.php 文件。

第三步

我们需要添加额外的数据库表,所以运行以下命令

php artisan migrate

第四步

创建表单包的配置文件。这将在一个名为formbuilder.php的文件放入您的配置文件夹中。在配置文件中,您可以更改包的路由URL路径、要使用的布局模板以及脚本/样式输出部分。

运行以下命令

php artisan vendor:publish --tag formbuilder-config

第五步

更新您的blade模板文件。在默认的Laravel安装中,模板文件位于此处:/resources/views/layouts/app.blade.php

您需要在blade文件顶部(在关闭的head标签之上)添加新的样式和脚本的标签

@stack('styles')

在blade文件底部(在关闭的body标签之上)

@stack('scripts')

注意:如果您需要更改使用这些@stack值调用的文件,您可以更新配置文件。

第六步

通过运行以下命令发布自定义blade视图文件

php artisan vendor:publish --tag formbuilder-views

通过运行以下命令发布公共资产

php artisan vendor:publish --tag formbuilder-public

或者您可以使用以下命令一次性发布所有内容

php artisan vendor:publish --provider="doode\FormBuilder\FormBuilderServiceProvider"

第七步

为了正确链接附件,您需要运行storage:link命令,这将使存储文件夹公开可访问

php artisan storage:link

访问应用

完成!现在可以访问表单应用。 https://:8000/form-builder/forms

查看提交: https://:8000/form-builder/my-submissions

使用Trait

您可以在您的应用中访问属于用户的所有表单和提交。要使用此Trait,请向您的用户模型类添加一个use语句。

use doode\FormBuilder\Traits\HasFormBuilderTraits;

class User extends Authenticatable
{
    use HasFormBuilderTraits;
}

现在您可以通过运行以下命令访问用户的表单和提交

$user = User::first(); or User::find($id);

// get the user's forms
$user->forms;

// get the user's submissions
$user->submissions;

// or use static methods on the doode\FormBuilder\Models\Form class
$user_forms = Form::getForUser($user); // returns a paginated resultset

// the doode\FormBuilder\Models\Submission class also has a static method for getting the submissions
// that belong to a user
$my_submissions = Submission::getForUser($user); // returns a paginated resultset

使用事件

当记录创建或更新时,该包会触发多个事件,以便您可以在应用逻辑中监听这些事件并执行自定义任务

注意事项

  1. 请确保您的数据库中有一个名为users的表,并且有一个名为id的列{bigSignedInteger}。
  2. 一旦在表单上提交了提交,不要尝试再次编辑该表单,因为它将破坏早期提交的显示。3. 我正在努力改进用户体验。

此项目遵循all-contributors规范。欢迎任何形式的贡献!

许可证

版权所有 © Doode

所有Doode包都是开源软件,受MIT许可证许可。