Symfony/bootstrap 中是否可以有一个自动完成文本框？ [关闭]

我正在使用 Symfony 2.4 和 Braincrafted Bootstrap 捆绑包。我一直在寻找一种在 Bootstrap 中拥有自动完成文本框的方法，但似乎我需要一个外部库来执行此操作（“Typeahead”？）。

首先，用 Bootstrap 本地肯定不可能做到这一点吗？ 其次，除了 Typeahead 之外，还有其他推荐的替代方案吗？

Thanks

A 预先输入可以使用 Symfony2 完成，尽管可能需要一些时间。这里有一个一步步例子：

实体：

既然所有（或者至少是大多数）Symfony2 中的表单映射到您应该从这里开始的实体。您想要的实体的一个重要部分预先输入因为是__toString方法。在这个例子中我们有一个Address entity:

class Address
{
    /**
     * @ORM\Column(type="string")
     * @Assert\NotBlank(message="Please enter an address")
     */
    protected $addressstring;

    public function __toString()
    {
        return $this->getAddressstring();
    }        
}

表格：

现在我们有了可爱的小Address让我们将其添加到EventType形式。在里面buildForm方法我们添加我们的地址字段:

$builder->add(
    $builder->create(
        'address', 
        'text',
        ['attr' => ['class' => 'address_typeahead']]
    )
);

请注意，字段类型是text并不是entity。这为我们提供了文本输入的优势，而不是愚蠢的下拉菜单或复选框之类的东西。我们还添加一个class快速获取字段的属性javascript.

模板：

让我们创建一个简单的表单模板：

<form action="{{ path('event_add') }}" method="post" {{ form_enctype(form) }}>
    {{ form_widget(form) }}
    <input class="btn btn-primary" type="submit" value="Create Event" />
</form>

并且还添加一些javascript below:

$('.address_typeahead').typeahead({
    source: function (query, process) {
        var addressobj = $(this).parent();
        return $.get('{{ path('events_address_typeahead') }}', { 'addr': query }, function (data) {
            return process(data);
        });
    }
});

那个行动：

我们就快到了。但是typeaheadAction不见了。让我们将其添加到我们选择的控制器中：

/**
 * @Route("/address/typeahead", name="events_address_typeahead")
 * @Method("GET")
 */
public function addressTypeaheadAction(Request $request)
{
    $addresses = // get all addresses e.g. from a repository

    return new JsonResponse(
        array_map(
            function ($val) {
                return (string) $val;
            },
            $addresses
        )
    );
}

提前输入现在应该已经在表单中为您提供了一些不错的选项。

变压器：

我们需要在这里做的最后一件事是添加DataTransformer。有了这个 Symfony2 就能够转换将表单字段的值转换为另一种类型（或者在我们的例子中进入一个实体）。所以让我们快速创建一个AddressTransformer:

class StringToAddressTransformer implements DataTransformerInterface
{   
    /**
     * transforms the Address-Object into a String
     */
    public function transform($addrobj)
    {
        if (!$addrobj) {
            return null;
        }

        return $addrobj->__toString();
    }

    /**
     * Reverts Transformation from String to Address Object
     */
    public function reverseTransform($address)
    {

        if (null === $address) {
            return null;
        }

        // .. do anything to transform the string into an object

        return $addrobj;
    }
}

这个变压器确实为我们带来了魔力！最后一步是将其添加到我们的表单中。改变你的buildForm步骤2的方法如下：

$builder->add(
    $builder->create(
        'address', 
        'text',
        ['attr' => ['class' => 'address_typeahead']]
    )->addModelTransformer(new StringToAddressTransformer())
);

啊啊啊，你就完成了！

• 关于 DataTransformer 的文档 http://symfony.com/doc/current/cookbook/form/data_transformers.html
• 这个例子来自我的旧项目 https://bitbucket.org/ferdynator/siyabonga/