我无忧无虑地重现了本教程,一切正常。但是,当我在字段上应用“ Select2”时,它将不再起作用。
class TicketAdminForm extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('Client', EntityType::class, [
'class' => Clients::class,
'choice_label' => 'name',
'label' => "Client",
'placeholder' => '',
'attr' => ['data-provider' => 'select2'],
])
;
$formModifier = function (FormInterface $form, Clients $client = null) {
$entity = null === $client ? [] : $client->getEntities();
$form->add('entity', EntityType::class, [
'class' => 'App\Entity\Entity',
'placeholder' => '',
'choices' => $entity,
'label' => 'Entité',
'attr' => ['data-provider' => 'select2'],
]);
};
$builder->addEventListener(
FormEvents::PRE_SET_DATA,
function (FormEvent $event) use ($formModifier) {
// this would be your entity, i.e. Clients
$data = $event->getData();
$form = $event->getForm();
$formModifier($event->getForm(), $data->getClient());
}
);
$builder->get('Client')->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)
$client = $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(), $client);
}
);
}
{{ form_start(form, {'attr': {'class': 'form-horizontal'} }) }}
<div class="box-body">
{{ form_row(form.client) }}
{{ form_errors(form.client) }}
{{ form_row(form.entity) }}
{{ form_errors(form.entity) }}
</div>
<!-- /.box-body -->
<div class="box-footer">
<div class="col-md-offset-2 col-sm-8">
<button id="dropbutton" class="btn bg-ticketing btn-flat form-control" type="submit">
{{ 'Submit the ticket'|trans({}, 'TicketingBundle') }}
</button>
</div>
</div>
<!-- /.box-footer -->
{{ form_end(form) }}
</div>
<script>
var $client = $('#ticket_admin_form_client');
// When client gets selected ...
$client.change(function() {
console.log('dans change');
// ... retrieve the corresponding form.
var $form = $(this).closest('form');
// Simulate form data, but only include the selected client value.
var data = {};
data[$client.attr('name')] = $client.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 entity field ...
$('#ticket_admin_form_entity').replaceWith(
// ... with the returned one from the AJAX response.
$(html).find('#ticket_admin_form_entity')
);
// Entity field now displays the appropriate entities.
}
});
});
</script>
仅当我删除表单中的'attr' => ['data-provider' => 'select2']
时,此代码才有效。
我尝试过:
$('#ticket_admin_form_client').on("select2:selecting", function(e) {
console.log('test');
});
但是它不起作用。
您是否有使其与select2一起使用的解决方案?
答案 0 :(得分:0)
很简单,在您的ajax方法中添加以下内容:
$('#ticket_admin_form_entity').select2({});
与此类似,在方法success
中:
// ...
$.ajax({
// ...
success: function(html) {
$('#ticket_admin_form_entity').replaceWith(
$(html).find('#ticket_admin_form_entity')
);
$('#ticket_admin_form_entity').select2({}); // Add this
}
// ...
;)