나는 마법사 폼을 동적으로 수정했습니다. 나는 문서 (http://symfony.com/doc/current/form/dynamic_form_modification.html#form-events-submitted-data)를 따라 왔고 하나의 문제가있다.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)}}
그리고 여기 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>
의 난을 console.log (HTML)를 할 수는 "모델"데이터를 포함하지 않는, 그래서 그것은 정확히 같은 HTML 구조를 보여줄 때하는 리스너로부터 검색되어야합니다.
내 관계를 모두 확인했는데 정상적으로 작동합니다.