嵌入的表单集合显示整个表单而不是单个字段

Question

我正在关注官方文档示例，但无法使其正常工作。

总结一下，我有 ma​​terial 和 items_budget 表。它们都通过 id 和 material 字段关联为 oneToMany 和 manyToOne：

Material.orm.yml:

oneToMany:
    itemsBudget:
        targetEntity: ItemsBudget
        mappedBy: material

ItemsBudget.orm.yml:

material:
    targetEntity: Material
    inversedBy: itemsBudget
    joinColumn:
        name: material
        referencedColumnName: id

这里是 ItemsBudgetType，我将material 字段设置为collection：

$builder->add('budget', 'entity', array(
            'class' => 'PanelBundle:Budget',
            'attr' => array(
                'class' => 'form-control',
            ),
        ))
        ->add('material', 'collection', array(
            'type' => new MaterialType(),
            'allow_add' => true
        ))
        ->add('quantity', 'number', array(
            'attr' => array(
                'class' => 'form-control',
            ),
        ))
        ->add('price', 'money', array(
            'attr' => array(
                'class' => 'form-control',
            ),
        ));

仅供参考，MaterialType：

$builder->add('name', 'text', array(
            'attr' => array(
                'class' => 'form-control',
            ),
        ))
        ->add('description', 'text', array(
            'attr' => array(
                'class' => 'form-control',
            ),
        ))
        ->add('current_quantity', 'text', array(
            'attr' => array(
                'class' => 'form-control',
                'required' => false
            ),
        ))
        ->add('price', 'money', array(
            'attr' => array(
                'class' => 'form-control',
            ),
        ));

这里是我的ItemsBudget视图的index.html.twig：

<strong>Materiais</strong>
<div class="form-group">
    <ul class="materials" data-prototype="{{ form_widget(form.material.vars.prototype)|e }}">
        {% for material in form.material %}
            <li>{{ form_widget(form.material.vars.prototype.name) }}</li>
        {% endfor %}
    </ul>
</div>

在视图中，我也尝试过，如示例中的：{{ form_row(material.name) }}，但它仍然显示整个 Material 形式。

我在哪里打电话给他们，在 ItemsBudgetController：

public function addAction(Request $request)
{
    $form = $this->createForm(new ItemsBudgetType(), new ItemsBudget());
    $manager = $this->getDoctrine()->getManager();

    if ($request->getMethod() == 'POST') {
        $form->handleRequest($request);

        if ($form->isValid()) {
            $ItemsBudgetEntity = $form->getData();
            $manager->persist($ItemsBudgetEntity);
            $manager->flush();

            $BudgetEntity = $form->get('budget')->getData();
            $BudgetEntity->addItemsBudget($ItemsBudgetEntity);

            $manager->persist($BudgetEntity);
            $manager->flush();

            $this->addFlash('success', 'Materiais para o orçamento adicionados');

            return $this->redirect($this->generateUrl('panel_budgets'));
        }
    }

    return $this->render('PanelBundle:ItemsBudget:index.html.twig', array(
        'form' => $form->createView(),
        'budgets' => $manager->getRepository('PanelBundle:Budget')->findAll()
    ));
}

示例中的 JavaScript 也相同：

function addMaterial($collectionHolder, $newLinkLi) {
    var prototype = $collectionHolder.data('prototype');
    var index = $collectionHolder.data('index');
    var newForm = prototype.replace(/__name__/g, index);

    $collectionHolder.data('index', index + 1);

    var $newFormLi = $('<li></li>').append(newForm);
    $newLinkLi.before($newFormLi);
}

var $collectionHolder;
var addMaterialLink = $('<a href="#" class="add_material_link">Mais</a>');
var $newLinkLi = $('<li></li>').append(addMaterialLink);

jQuery(document).ready(function () {
    $collectionHolder = $('ul.materials');
    $collectionHolder.append($newLinkLi);
    $collectionHolder.data('index', $collectionHolder.find(':input').length);

    addMaterialLink.on('click', function (e) {
        e.preventDefault();
        addMaterial($collectionHolder, $newLinkLi);
    });
});

这就是问题所在：每次单击“Mais”时，它都会显示整个表单，而不是仅显示 Material 表单中的 name 字段。我错过了什么吗？

Answer 1

javascript 获取data-prototype 属性的内容并将其附加到表单的html 中。模板中的属性包含{{ form_widget(form.material.vars.prototype)|e }}，它是表单的 html 原型。

试试：

<ul class="materials" data-prototype="{{ form_widget(form.material.vars.prototype.name) }}">