Twig 扩展,引入新的块来分离表单的 HTML 结构和装饰它的 CSS 以及增强其功能的 JavaScript。

v2.0.0 2023-02-15 21:31 UTC

README

此包引入了新的 Twig 块:form_jsform_js_prototypeform_css

这些块将表单类型的 HTML 结构与装饰表单的 CSS 以及增强其功能的 JavaScript 分离。此外,JavaScript 块还包括 form_js_prototype 块,其中包含任何初始化逻辑,该逻辑应在添加该类型的新字段时调用。

如果使用得当,它们可以轻松嵌入增强 JavaScript 的表单类型集合。

1. 安装

1.1 将依赖项添加到您的 composer.json

"require": {
    "symfony2admingenerator/form-bundle": "@stable"
}

并在您的项目根目录中运行 composer update

1.2 在您的 AppKernel.php 中启用此包

<?php
// AppKernel.php
public function registerBundles()
{
    $bundles = array(
        // ...
        new Admingenerator\FormBundle\AdmingeneratorFormBundle(),
    );
}
?>

2. 使用

此包为您的表单添加了新的 Twig 块。在 Symfony2 中,对于表单类型别名 my_form,您有一个 my_form_widget 块,其中放置与您的表单类型相关的所有内容。这对于默认的 Symfony2 表单类型来说是完全可行的,因为它们只包含基本表单元素。

为了引入漂亮的 GUI 表单小部件,我们需要用 CSS 对其进行样式设计,并使用 JavaScript 增强其功能。因此,为此目的,此包引入了新的块。在我们的示例中,这些将是 my_form_cssmy_form_js

集合中的 JavaScript 增强表单

为了使实现添加/删除表单集合中的项更加容易,我们还添加了一个 JavaScript 原型块,该块位于表单 JavaScript 块内部。示例

{% block my_form_js %}
<script type="text/javascript">
	// note: this example uses jQuery
	$field = $("#{{ id }}");

	{% block my_form_js_prototype %}
		// add thick red border to the field
		$field.css({
			'border-color': 'red',
			'border-width': '10px',
			'border-style': 'solid'
		});
	{% block}
</script>
{% endblock %}

这样,我们就将 JavaScript 选择器代码与小部件初始化代码分离了,现在我们可以在我们的集合小部件中使用这些代码

{% block my_collection_form_js %}
<script type="text/javascript">
	var $collection = $('#{{ id }}');
	var $addButton 	= $('#{{ id ~ "_add_button" }}');

	var initJS = function($field) {
		// include js prototype code
		{{ form_js(prototype, true) }}
	};

	$addButton.on('click', function(e){
		// here create $newItem and add it to the page
		initJS($newItem);
	});
</script>
{% endblock %}

注意:此代码片段不包括添加新项的代码,因为这已在 如何嵌入表单集合 烹饪书中进行了介绍。

例如,研究 AdmingeneratorFormExtensionsBundle(位于 Resources/views/Form 目录中的模板)。

3. 致谢

此 twig 扩展是从 GenemuFormBundle 复制的。已更改 twig 块的名称,以避免冲突。

这个包很棒,但是出于我们的目的,我们只需要 Twig 扩展,所以我们决定将其提取出来并放入单独的包中。

4. 版本控制

发布将按照 主要.次要.补丁 格式进行编号。

并遵循以下指南构建。

  • 破坏向后兼容性会增加主要版本号。
  • 在不破坏向后兼容性的情况下添加的新功能会增加次要版本号。
  • 错误修复和其他更改会增加补丁版本号。

有关 SemVer 的更多信息,请访问 semver.org 网站。

5. 贡献

此包遵循 Vincent Driessen 在 A successful git branching model 博客文章中描述的分支模型。

  • master 分支用于标记稳定发布。
  • develop 分支用于开发小更改并将功能分支合并到其中。
  • feature- 分支用于开发功能。准备就绪后,向 develop 分支提交 PR。
  • 使用 hotfixes 分支来开发针对稳定版本中严重错误的修复。修复完成时,将修复内容合并到 developmaster 分支。
  • 为每个次要版本(例如 1.1)创建发布分支,只有补丁会被合并到这些分支中。

Branching model

6. 许可证

本软件包在 MIT 许可证 下发布,但文件 Resources/doc/branching-model.png(由 Vincent Driessen 创建)是在 Creative Commons BY-SA 许可证下发布的。