README

一个用于使用 JQuery Form Builder 创建拖放表单构建器的 Laravel 包。

注意：在演示中，电子邮件、注册和文件上传功能已被禁用

屏幕截图

表单字段以 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"}]

表单权限选项

公开 - 任何人都可以提交表单而无需登录
私有 - 仅您的网站的认证成员可以访问表单。为用户提供编辑他们之前提交的选项。

要求

Laravel 5.7
MySQL
Laravel 认证 - php artisan make:auth

如果您正在寻找一个可管理的云主机，具有简单的 Laravel 网站创建功能，那么我强烈推荐 Cloudways。Cloudways 可在几分钟内设置一个 Laravel 网站 MySQL 数据库。

包含在包中的依赖项

jQuery UI - 基于 jQuery 的用户界面操作。查看 jQuery UI 文档
jQuery Formbuilder - 拖放全功能表单编辑。查看 jQuery Formbuilder 文档
clipboard.js - 将文本复制到剪贴板。查看 Clipboard 文档
parsley.js - JavaScript 表单验证库。查看 Parsley 文档
moment.js - 解析、验证、操作和显示 JavaScript 中的日期和时间。查看 Moment 文档
footable - 基于 jQuery 和为 Bootstrap 制作的响应式表格插件。查看 FooTable 文档
sweetalert - 网站错误/警告/确认消息的美丽替代品。查看 SweetAlert 文档

安装说明

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

第一步

手动编辑您的 composer.json 文件或只需键入

composer require jazmy/jaz-form-builder

第二步

确保您已安装所有依赖项

composer install

注意：对于版本 5.6 及以上，包将自动使用 Laravel 的包发现功能进行注册。这意味着您不需要更新您的 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="jazmy\FormBuilder\FormBuilderServiceProvider"

第七步

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

php artisan storage:link

访问应用

太棒了！您做到了！现在可以访问表单应用。 http://your.domain.com/form-builder/forms

查看提交： http://your.domain.com/form-builder/my-submissions

使用特性

您可以在应用程序中访问属于用户的表单和提交。要使用特性，请将use语句添加到您的用户模型类中。

use jazmy\FormBuilder\Traits\HasFormBuilderTraits;

class User extends Authenticatable
{
    use HasFormBuilderTraits;
}

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

$user = User::first();

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

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

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

// the jazmy\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

使用事件

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

注意事项

请确保您的数据库中有一个名为users的表，其中有一个名为id的大整数列{bigSignedInteger}。
一旦您在一个表单上有提交，不要尝试再次编辑该表单，因为这会破坏早期提交的显示。

致谢

特别感谢Farayola Oladele，Fiverr上最好的Laravel程序员之一： https://www.fiverr.com/harristech 他教会了我很多，我强烈推荐他在您的Laravel项目中提供帮助。

mednasiridev / jaz-form-builder

维护者

详细信息