Symfony 2 - 根据另一个字段中的选择动态隐藏字段

Question

我搜索了很多，但找不到这个相当简单的问题的答案：

在 Symfony 2.8 中，我有一个表单，它呈现一个国家/地区字段。根据它的选择，我只想为选择“德国”（数据“D”）显示邮政编码和联邦州字段。这是国家/地区字段的代码：

                ->add('nationveranstaltungsort', ChoiceType::class, array(
                    'choices' => array(
                        'D' => 'Deutschland',
                        'AFG' => 'Afghanistan',
//many other countries following                   
                    ),
                    'data' => 'D',
                    'label' => 'Nation Tagungsstätte'))

它预先填充了选项“Deutschland”，数据“D”。

基于我要动态显示：

->add('plzveranstaltungsort', TextType::class, array('label' => 'PLZ', 'attr' => array('size' => '5', 'maxlength' => '5')))
                ->add('bundeslandveranstaltungsort', ChoiceType::class, array(
                    'choices' => array(
                        0 => '     ',
                        1 => 'Baden-Württemberg',
                        2 => 'Bayern',
                        3 => 'Berlin',
                        4 => 'Brandenburg',
                        5 => 'Bremen',
                        6 => 'Hamburg',
                        7 => 'Hessen',
                        8 => 'Mecklenburg-Vorpommern',
                        10 => 'Nordrhein-Westfalen',
                        11 => 'Rheinland-Pfalz',
                        12 => 'Saarland',
                        13 => 'Sachsen',
                        14 => 'Sachsen-Anhalt',
                        15 => 'Schleswig-Holstein',
                        16 => 'Thüringen',
                    ),
                    'data' => 0,
                    'label' => 'Bundesland Tagungsstätte'))

如果未选择“德国”，我只想隐藏/禁用这些字段（并在其他地方处理空值）。

我尝试了http://symfony.com/doc/current/form/dynamic_form_modification.html 和其他一些 javascript 的东西，但由于我基本上不知道任何 JS，所以我找不到任何合适的资源。

Answer 1

由于默认情况下nationveranstaltungsort 字段已选择德国，因此无需隐藏plzveranstaltungsort。您可以使用类似的方式隐藏在 Javascript 中：

var bund = document.getElementById("bundeslandveranstaltungsort");
bund.style.display = "none";

然后显示元素使用：

bund.style.display = "inline";

根据您使用的 css，您可能需要使用：

bund.style.display = "块";

在您的表单中，您可以指定一个属性以在更改时运行 Javascript 函数，如下所示：

->add('nationveranstaltungsort', ChoiceType::class, array(
    'choices' => array(
        'D' => 'Deutschland',
        'AFG' => 'Afghanistan',
    ),
    'data' => 'D',
    'label' => 'Nation Tagungsstätte',
    'attr' => array(
            'onchange' => 'changeCountry()',
    ),
))

然后在 Javascript 函数 changeCountry() 中隐藏元素或使用上面的方法显示它。 我显示的 ids 实际上并不是您将使用的，但是如果您使用浏览器工具，例如在 Firefox 中（我建议使用 FireFox 进行测试），您可以右键单击选择元素并选择“检查元素”；然后您可以看到您需要使用的“实际” id 值是什么。这取决于您的表单名称。