2017-03-18 16 views
0

私はbuilitフォームを動的に変更しました。私は文書(http://symfony.com/doc/current/form/dynamic_form_modification.html#form-events-submitted-data)に従ってきましたが、1つの問題があります。symfonyフォームのEventListenerが適切なhtml構造体を返さない

私の目標は、ユーザーが「ブランド」フィールドを選択するときに「モデル」フィールドを更新することです。ここで

は私のリスナーがどのように見えるかです:

public function buildForm(FormBuilderInterface $builder, array $options) 
{ 
    $builder 
     ->add('name') 
     ->add('brand', EntityType::class, [ 
      'class' => 'DEERCMS\BrandBundle\Entity\Brand', 
      'choice_label' => 'name', 
      'multiple' => false, 
      'expanded' => false, 
     ]); 

    $formModifier = function (FormInterface $form, Brand $brand = null) { 
     $models = null === $brand ? array() : $brand->getModels(); 

     $form->add('model', EntityType::class, array(
      'class'  => 'DEERCMS\ModelBundle\Entity\Model', 
      'choices'  => $models, 
      'multiple' => false, 
      'expanded' => false, 
     )); 
    }; 

    $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->getBrand()); 
     } 
    ); 

    $builder->get('brand')->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) 
      $brand = $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(), $brand); 
     } 
    ); 

} 

AJAX呼び出しを送信しているが、それは私の目標は、「モデル」と呼ばれるフィールドを更新することで、まったく同じHTML構造を返します。ここではテンプレートです:

{{ form_start(form, {'attr': {'id': 'form', 'class': 'form-horizontal', 'onChange': 'changed()' } }) }} 
    <div class="form-group"> 
     <label class="col-md-3 control-label">Marka </label> 
      <div class="col-md-9"> 
       {{form_row(form.brand, {'id': 'test', 'attr': { 'class': 'form-control'}}) }} 
      </div> 
    </div> 
    <div class="form-group"> 
     <label class="col-md-3 control-label">Model </label> 
      <div class="col-md-9"> 
       {{form_widget(form.model, {'id': 'test1', 'attr': { 'class': 'form-control'}}) }} 
       </div> 
    </div> 

    <div class="form-group"> 
     <label class="col-md-3 control-label"></label> 
      <div class="col-md-9"> 
       <button type="submit" class="btn btn-success">{% if is_editing %}EDYTUJ {% else %}DODAJ{% endif %}</button> 
      </div> 
    </div> 
{{form_end(form)}} 

そして、ここでは、私はにconsole.log(HTML)を行うと、それは「モデル」のデータが含まれていないので、AJAX呼び出し

<script> 
function changed() { 
    var brand = $('#test'); 
    // ... retrieve the corresponding form. 
    var $form = $('#form'); 

    console.log($form); 
    // Simulate form data, but only include the selected sport value. 
    var data = {}; 
    data[brand.attr('name')] = brand.val(); 
    // Submit data via AJAX to the form's action path. 
    jQuery.ajax({ 
     url : $form.attr('action'), 
     type: "POST", 
     data: data, 
     success: function (html) { 
      console.log(html) 
      $("#test1").replaceWith(
       // ... with the returned one from the AJAX response. 
       $(html).find("#test1") 
      ); 
      // Position field now displays the appropriate positions. 
     } 
    }); 
} 
</script> 

は、それがどの、まったく同じHTML構造を示していますリスナーから取得する必要があります。

私はすべての関係をチェックしており、正常に動作しています。

答えて

0

解決済み!

私がonChange()属性をform_startに持っていて、form_row(form.brand)の内側にあるという理由で、

関連する問題