README

此模块允许在JavaScript端对Symfony 4或更高版本的表单进行验证。它将表单类型约束转换为JavaScript验证规则。

如果你使用的是Symfony 4.4或5.x，则需要使用版本1.7.x

如果你使用的是Symfony 4.*，则需要使用版本1.6.x-dev

如果你使用的是Symfony 3.1.*，则需要使用版本1.5.*

如果你使用的是Symfony 3.0.*，则需要使用版本1.4.*

如果你使用的是Symfony 2.8.*或2.7.*，则需要使用版本1.3.*

如果你使用的是Symfony 2.6.*或更低版本，则需要使用版本1.2.*

1 安装

1.1 使用composer下载FpJsFormValidatorBundle

在终端运行

$ composer require "shopsys/jsformvalidator-bundle":"dev-master"

或者，如果你想避免意外问题，最好使用确切版本。

$ composer require "shopsys/jsformvalidator-bundle":"v1.6.*"

1.2 启用JavaScript库

有三种方式初始化此库的JavaScript文件。你可以创建webpack中的新条目，或者将主文件导入到你的JavaScript中。

1.2.1 在webpack.config.js中添加FpJsFormValidatorBundle

Encore
    ...
    .addEntry('app', './assets/js/app.js')
+   .addEntry('FpJsFormElement', './vendor/fp/jsformvalidator-bundle/Fp/JsFormValidatorBundle/Resources/public/js/FpJsFormValidatorWithJqueryInit.js')
    ...
    .configureBabel(null, {
        useBuiltIns: 'usage',
        corejs: 3,
    })
;

并在模板中包含新条目

+   {{ encore_entry_script_tags('FpJsFormElement') }}
    {{ encore_entry_script_tags('app') }}

1.2.2 在主JavaScript中导入FpJsFormValidatorBundle

  import $ from 'jquery';
+  import 'path-to-bundles/fpjsformvalidator/js/FpJsFormValidator';
+  import 'path-to-bundles/fpjsformvalidator/js/jquery.fpjsformvalidator';

1.2.3 在模板中使用初始化

{% block javascripts %}
+   {{ js_validator_config() }}
+   {{ init_js_validation() }}
{% endblock %}

1.4 添加路由

如果你使用的是UniqueEntity约束，那么你必须将以下部分添加到你的路由配置中：app/config/routing.yml

# ...
fp_js_form_validator:
    resource: "@FpJsFormValidatorBundle/Resources/config/routing.xml"
    prefix: /fp_js_form_validator

确保你的安全设置不会阻止这些路由。

2 使用

完成前面的步骤后，JavaScript验证将自动为所有表单启用。

1. 禁用验证
2. 如果你的表单位于子请求中
3. 如果你需要单独初始化表单的JS验证或通过某些事件，在这种情况下，你需要遵循这些步骤，而不是第1.3章

3 定制

前言

此包为symfony表单的每个元素查找相关的DOM元素，并将其附加到一个特殊对象validator上。此对象包含一组属性和方法，完全定义了相关表单元素的验证过程。其中一些属性和方法可以更改以定制验证过程。

如果你以某种程度定制了表单的渲染，请阅读此说明。

1. 禁用指定字段的验证
2. 错误显示
3. 从闭包中获取验证组
4. 获取器验证
5. 回调约束
6. 选择约束。如何从回调获取选项列表
7. 自定义约束
8. 自定义数据转换器
9. 检查实体的唯一性
10. 通过JavaScript提交表单
11. onValidate回调
12. 在自定义事件上运行验证
13. 集合验证

4 本地开发

需求

• 使用docker-compose的docker
• make

运行应用程序

docker-compose up -d --build
make install
# test form will be available at http://127.0.0.1:8080

运行测试

make tests