javascript - Symfony2 级联下拉值通过 ajax 更改，提交时不接受

Question

我的 symfony 表单中有两个实体下拉列表字段。在前端，我根据第一个下拉列表所选值的值，使用ajax更改第二个下拉列表的选项列表。提交表单后，我收到错误消息，

This value is not valid.

下面是代码；

/**
 * @ORM\ManyToOne(targetEntity="State")
 * @ORM\JoinColumn(name="province_id", referencedColumnName="id")
 */
protected $Province;

/**
 * @ORM\ManyToOne(targetEntity="District")
 * @ORM\JoinColumn(name="district_id", referencedColumnName="id")
 */
protected $District;

并以表格形式，

 ->add('domicileDistrict','entity', [
                'label' => ucwords('District'),
                'class'=>'GeneralBundle\Entity\District',
                'required' => true,
                'mapped' => true,
                'attr' => ['class' => 'form-control'],
                'label_attr' => ['class' => 'control-label'],
            ])
->add('domicileProvince','entity', [
                'label' => ucwords('Province'),
                'class'=>'GeneralBundle\Entity\State',
                'required' => true,
                'attr' => ['class' => 'form-control select2'],
                'label_attr' => ['class' => 'control-label'],
            ])

在前端，

 $("#profile_from_type_domicileProvince").change(function() {
                var state = $('option:selected', this).val();
                getDistrictByState(state);
            });

            function getDistrictByState(state){
                var dict = {
                    type: "POST",
                    url: "{{ url('ajax_district_by_stateId') }}?id=" + state,
                    success: function(e) {
                       $("#profile_from_type_domicileDistrict option").remove();
                        $.each(e, function(e, p) {
                            $("#profile_from_type_domicileDistrict").append($("<option />", {
                                value: e,
                                text: p
                            }));
                        });
                    } 
                };
                $.ajax(dict);
            }

更新:添加 PRE_SUBMIT 事件；

在@Alsatian提出建议后，我更新了我的表单并添加了如下事件，但选择第一个下拉列表时没有任何反应。

$builder->addEventListener(FormEvents::PRE_SUBMIT, [$this, 'preSubmitData']);

  public function preSubmitData(FormEvent $event){
        $form = $event->getForm();
        $data = $event->getData();

        if (array_key_exists('Province', $data)) {
            $state = $data['Province'];
            $event->getForm()
                ->add('District','entity', [
                    'label' => ucwords('District'),
                    'class'=>'GeneralBundle\Entity\District',
                    'required' => true,
                    'mapped' => true,
                    'query_builder' => function(DistrictRepository $repository) use ($state) {
                        $qb = $repository->createQueryBuilder('d')
                            ->andWhere('d.verified = :verified')
                            ->andWhere('d.active = :active')
                            ->setParameter('verified', true)
                            ->setParameter('active', true);

                        if ($state instanceof State) {
                            $qb = $qb->where('d.state = :state')
                                ->setParameter('state', $state);
                        } elseif (is_numeric($state)) {
                            $qb = $qb->where('d.state = :state')
                                ->setParameter('state', $state);
                        } else {
                            $qb = $qb->where('d.state = 1');
                        }

                        return $qb;
                    },
                    'attr' => ['class' => 'form-control select2'],
                    'label_attr' => ['class' => 'control-label'],
                ]);

        }
    }

Answer 1

我也遇到了同样的问题。

我在这里写了一个包来处理“可扩展”选择类型(也是实体或文档): https://github.com/Alsatian67/FormBundle/blob/master/Form/Extensions/ExtensibleSubscriber.php

我是如何做到的:

在表单提交过程中进行Hook，我们可以通过PRE_SUBMIT FormEvent访问到提交的实体。所有提交的实体均已加载并位于 $event->getData() 中。

然后我们只需将此提交的选择作为该字段的新“选择”选项即可。

注意:这样做只会验证提交的实体是否存在!如果只有一部分实体是可能的选择，则必须添加约束来验证它们。

您还可以根据第一个下拉列表的值在 PRE_SUBMIT 事件中设置选择(而不是使用所有提交的实体)。