버튼을 누른 후 동적 양식 필드 추가하기

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> 

그것을 제출할 때이를 위해, 나는 심포니의 요리 책 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을 사용해야했습니다. 내가 AFTER 추가 제출 없었기 때문에 나는 심포니의 요리 책

$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>