如何根据第一个填充第二个选项列表答案

【问题标题】：How to populate second option list based on first one如何根据第一个填充第二个选项列表
【发布时间】：2015-09-26 23:11:39
【问题描述】：

好的，第一件事。我已经知道如何使用jQuery 和AJAX 请求根据第一个选择填充第二个选项列表。

我的问题在用户提交表单后开始。假设您提交了表单，但它拒绝了您的请求，因为您忘记了一些输入。在这种情况下，我必须填充第二个选项列表，而无需用户再次选择第一个。

首先我将request 对象注入到表单类中，如果请求是post 并且值大于0，我填充第二个选项列表。

这是正确的方法吗？我怎样才能使这个操作更好？

<?php
public function buildForm(FormBuilderInterface $builder, array $options)
{
    $city = $this->request->get('fos_user_registration_form_city', 0);
    // if city selected then populate provinces...
    if($city)
        $provinces = $this->getProvinces($city);
    else
        $provinces = [0 => '...'];

    $builder->add('provinces', 'choice', array(
            'choices'  => $provinces,
            'label' => 'form.province',
            'preferred_choices' => array(0),
            'translation_domain' => 'FOSUserBundle',
            'required' => true,
        ));
}

【问题讨论】：

标签： php symfony symfony-forms

【解决方案1】：

您可以使用表单事件：PRE_SET_DATA POST_SUBMIT 该类型现在看起来像：

namespace AppBundle\Form\Type;
use Symfony\Component\Form\FormInterface;
use AppBundle\Entity\Sport;
class SportMeetupType extends AbstractType {
public function buildForm(FormBuilderInterface $builder, array $options)
{
    $builder
        ->add('sport', 'entity', array(
            'class'       => 'AppBundle:Sport',
            'placeholder' => '',
        ));
    ;
    $formModifier = function (FormInterface $form, Sport $sport = null) {
        $positions = null === $sport ? array() : $sport->getAvailablePositions();

        $form->add('position', 'entity', array(
            'class'       => 'AppBundle:Position',
            'placeholder' => '',
            'choices'     => $positions,
        ));
    };

    $builder->addEventListener(
        FormEvents::PRE_SET_DATA,
        function (FormEvent $event) use ($formModifier) {
            // this would be your entity, i.e. SportMeetup
            $data = $event->getData();

            $formModifier($event->getForm(), $data->getSport());
        }
    );

    $builder->get('sport')->addEventListener(
        FormEvents::POST_SUBMIT,
        function (FormEvent $event) use ($formModifier) {
            // It's important here to fetch $event->getForm()->getData(), as
            // $event->getData() will get you the client data (that is, the ID)
            $sport = $event->getForm()->getData();

            // since we've added the listener to the child, we'll have to pass on
            // the parent to the callback functions!
            $formModifier($event->getForm()->getParent(), $sport);
        }
    );
} }

并且在您的树枝模板中，您可以使用 somme javascript 使用新数据自动更新表单：

{# app/Resources/views/Meetup/create.html.twig #}
{{ form_start(form) }}
{{ form_row(form.sport) }}    {# <select id="meetup_sport" ... #}
{{ form_row(form.position) }} {# <select id="meetup_position" ... #}
{# ... #}
{{ form_end(form) }}
<script>
  var $sport = $('#meetup_sport');
  // When sport gets selected ...
  $sport.change(function() {
  // ... retrieve the corresponding form.
 var $form = $(this).closest('form');
 // Simulate form data, but only include the selected sport value.
 var data = {};
 data[$sport.attr('name')] = $sport.val();
 // Submit data via AJAX to the form's action path.
 $.ajax({
 url : $form.attr('action'),
 type: $form.attr('method'),
 data : data,
 success: function(html) {
   // Replace current position field ...
    $('#meetup_position').replaceWith(
      // ... with the returned one from the AJAX response.
      $(html).find('#meetup_position')
    );
     // Position field now displays the appropriate positions.
   }
   });
 });
 </script>

更多信息可以查看this

【讨论】：