嵌入的表单集合显示整个表单不受单个字段的影响

Question

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

总结一下，我有材料和 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',
            ),
        ));

此处index.html.twig视图的 ItemsBudget ：

<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) }}，但它仍然显示整个材质表单。

我在呼叫他们的地方，在 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”时，它都会显示整个表单，而不是仅显示name表单中的Material字段。我错过了什么吗？