ボタンを押した後で動的フォームフィールドを追加する

Question

単純なボタン$builder->add('language_switcher', ButtonType::class);のフォームがあります。これは、単に押すと別のフィールドを追加するだけです。今私はButtons do not support event listeners.は、だから私は隠しフィールドでそれを試してみたエラーを取得していますAJAX

経由

<script> 
    var $button = $('#xyz'); 

    $button.click(function() { 
     var $form = $(this).closest('form'); 
     $.ajax({ 
      url: $form.attr('action'), 
      type: $form.attr('method'), 
      success: function(html) { 
       console.log(html); 
       $('#xyz').replaceWith($(html).find('#lang_switcher')); 
      } 
     }); 
    }); 
</script> 

それを提出する際にそれをするために、私はsymfonyの料理http://symfony.com/doc/current/form/dynamic_form_modification.html

$builder 
    ->get('language_switcher') 
    ->addEventListener(
     FormEvents::POST_SUBMIT, 
     function() use ($builder, $options) { 
      $preparedOptions = $this->prepareOptions($options['data']['productCustomizations']); 
      $builder->add('lang_switcher'), ChoiceType::class, $preparedOptions); 

     } 
    ); 

を使用しました。私は、フォームに隠しフィールドを追加し、それにEventListenerを設定し、しかし、これは何もしなかった私のAJAX要求

data[$('#id_of_hidden_field').attr('name')] = 1;

にこのdataを追加しました。コックブックの例は選択肢フィールドを提出した後で、私のニーズにどのように適応させるかわかりません。私はSubmitTypeを使用できませんでした。なぜなら、それはフォームを提出するのでしょうか？私はちょうど簡単なボタンでそれを持っていたい。

問題は、私はconsole.log(html)私は新しいhtml要素が表示されないので、私は奇妙なEventListenerには到着していないようだので、いくつかのデータを取得しています。私はそれを応答の中に入れていないようです。

Answer 1

いいえ、それを得ました。問題はPOST_SUBMITイベントの中でbuilderを使用したことですが、FormInterfaceを使用しなければなりませんでした。私は後に追加提出することができませんでしたので、私はsymfonyの料理

$formModifier = function (FormInterface $form, $preparedOptions) { 
    $form->add($this->childIdentifier, ChoiceType::class, $preparedOptions); 
}; 

と同じコールバック関数を購入しなければならなかった。そしてリスナーはどのようにイベントリスナーを付けについては、この

$builder 
    ->get('lang_switcher') 
    ->addEventListener(
     FormEvents::POST_SUBMIT, 
     function (FormEvent $event) use ($formModifier, $options) { 
      $preparedOptions = $this->prepareOptions($options); 
      $formModifier($event->getForm()->getParent(), $preparedOptions); 
     } 
    ); 

Answer 2

<script type="text/javascript"> 
    function inputBtn(){ 
    var input=document.createElement('input'); 
    input.type="file"; 
    input.name="img[]"; 
    input.multiple="multiple"; 
    //without this next line, you'll get nuthin' on the display 
    document.getElementById('target_div').appendChild(input); 
} 
</script> 

<button id="ifile" onclick="inputBtn();">create</button> 
<form action="test.php" method="post" enctype="multipart/form-data"> 
<div id="target_div"></div> 
<input type="submit"> 
</form>