Symfony 4 - флажок не в запросе, когда не нажата (добавлена ​​через js рекламный прототип) - PullRequest
Новая
       11

Symfony 4 - флажок не в запросе, когда не нажата (добавлена ​​через js рекламный прототип)

0 голосов
/ 09 апреля 2020

Я пытаюсь использовать флажки в качестве Коллекции. Моя проблема в том, что некоторые чекбоксы не отправляются в запросе, если не нажать на них: те, которые добавляются динамически через js.

. Для простоты я создал тестовую форму, в которой возникает проблема.

Итак, я использую форму с коллекцией CheckboxType, с одним предопределенным элементом (не проверено): 

<?php

namespace App\Form;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolver;
use Symfony\Component\Form\Extension\Core\Type\CheckboxType;
use Symfony\Component\Form\Extension\Core\Type\CollectionType;

class TestType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add(
                'testcheckbox', 
                CollectionType::class, array(
                    'allow_add' => true,
                    'prototype' => true,
                    'entry_type' => CheckboxType::class,
                    'entry_options' => array(
                        'required' => false,
                    ),
                    'data' => array(
                        1 => false
                    )
                )
            )
            ;
    }

    public function configureOptions(OptionsResolver $resolver)
    {
        $resolver->setDefaults([
        ]);
    }
}

Я получил эту веточку: 

{% extends 'base.html.twig' %}
{% import _self as formMacros %}

{% block content %}
    <h3>Testform</h3>
    <div id="form_container">
    {{ form_start(test_form) }}

    <div class="js-test-wrapper" data-prototype="{{formMacros.printTestRow(test_form.testcheckbox.vars.prototype, test_form.testcheckbox|length+1)|e('html_attr') }}" data-index="{{test_form.testcheckbox|length }}">
    {% for testField in test_form.testcheckbox %}
        {% set counter = ( counter | default(0) ) + 1 %}
        {% include 'test/test.testfield.html.twig' with {'testField': testField, 'number': counter} %}
        {{form_widget(testField)}}
    {% endfor %}
    </div>
    <div class="form-group row">
        <div class="col-sm-8">
            <span id="button_add_testfield" onclick="add_testfield()">+ Add Testfield</span>
        </div>
        <div class="col-sm-2">

        </div>
    </div>

    <div class="form-group row">
        <div class="col-sm-8"></div>
        <div class="col-sm-2">
            <input type="submit" value="Submit" class="btn btn-success">
        </div>
    </div>
    {{ form_end(test_form) }}
    </div>
{% endblock %}

{% macro printTestRow(testField, number) %}
    {% include 'test/test.testfield.prototype.html.twig' with {'testField': testField} %}
{% endmacro %}

Как вы видно, веточка использует две разные ветки для печати флажков. Один для создания с помощью ветки (для существующих предметов коллекции). И еще один для создания новых предметов с помощью js. 

//test/test.testfield.html.twig
<div class="form-group row" id="testfield_{{number}}_formgroup">
    <div class="col-sm-8" id="testfield_{{number}}_label">Testfield {{number}}</div>
    <div class="col-sm-2">
        {{ form_widget(testField) }}
    </div>
    <div class="col-sm-2">

    </div>
</div>

//test/test.testfield.prototype.html.twig
<div class="form-group row" id="testfield___name___formgroup">
    <div class="col-sm-8" id="testfield___name___label">Testfield __name__</div>
    <div class="col-sm-2">
        {{ form_widget(testField) }}
    </div>
    <div class="col-sm-2">

    </div>
</div>

И, наконец, метод js, который добавляет новые элементы в коллекцию: 

function add_testfield(){
    var wrapper = $('.js-test-wrapper');
    var test_prototype = wrapper.data('prototype');
    var index = wrapper.data('index');
    var newField = test_prototype.replace(/__name__/g, index+1);    
    $('.js-test-wrapper').append(newField);
    wrapper.data('index', index + 1);

Вывод html для флажков правильный. Увеличивается только идентификатор.

Теперь проблема: если я не проверяю ни один из флажков, в запросе присутствует только первый флажок. Остальные отправляются только при проверке. Я уже знаю это поведение из простого php / html.

Но в этом случае я хочу снова показать форму. Но это приводит к ошибке, когда отправленные флажки отсутствуют.

Кто-нибудь знает, что именно делает первый флажок всегда существующим и как я могу применить этот параметр к другим динамически создаваемым флажкам?

Привет и спасибо

...