php - Symfony2 Sonata 管理员根据所选值动态更改输入数据

Question

对于我的一个对象，我需要创建一些动态表单渲染...但我不知道如何在 Sonata Admin 中执行此操作。例如，当我创建一个对象时，我有一个字段类型。在此字段中，我选择我的对象的类型。现在，当我选择类型时，我想根据类型显示一个字段。例如，如果我选择类型“轮播”，我想显示一个选择实体库中所有对象的字段。如果我选择类型“产品”，我想显示包含所有可供选择的产品的字段...我怎样才能实现这一点？

现在我有这个:

/**
 * @param FormMapper $formMapper
 */
protected function configureFormFields(FormMapper $formMapper)
{
    $formMapper
        ->with('Module', array(
            'class' => 'col-md-6'
        ))
            ->add('position')
            ->add('type', null, array(
                'attr' => array('class' => 'module_type')
            ))
            ->add('items', 'entity', array(
                'class' => 'ApplicationSonataMediaBundle:Gallery'
            ))
        ->end()
    ;
}

我已经覆盖了编辑模板:

{% extends 'SonataAdminBundle:CRUD:edit.html.twig' %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript">
        $(document).ready(function () {
            $(".module_type").change(function() {

            });

        });
    </script>

{% endblock %}

如您所见，图库现在已硬编码..

我现在不知道该怎么做...怎么说如果选择的值是这个，则在字段中使用该实体...问题是在Sonata中渲染表单的方式非常复杂.. .我不明白..

也许我应该使用ajax？但是，当我发送一个值并获得响应时，如何在不刷新的情况下添加字段？

感谢任何帮助。

Answer 1

在不断研究找到一种使用ajax和奏鸣曲与symfony4使用动态下拉菜单的方法之后，我想分享我的解决方案，它对我来说是如何实际工作的。

就我而言，我有一个区，这个区有不同的城市。我有一家公司，首先选择一个地区，然后根据该地区选择城市。

我做了什么:

1. 为地区创建实体

2. 为城市创建实体

3. 进入您的主类(在我的例子中，这是公司实体，并为地区和城市添加两个实体

    /**
     * @ORM\ManyToOne(targetEntity="App\Wdm\MainBundle\Entity\Model\Cities",   inversedBy="id")
     */
    private $city;

    /**
    * @ORM\ManyToOne(targetEntity="App\Wdm\MainBundle\Entity\Model\Districts", inversedBy="id")
    */
     private $district;

更新您的数据库架构并使用一些示例数据填充城市和地区字段

进入configureFormFields函数中的AdminClass并添加以下内容(确保将“choice_label”选项与您所在地区或城市实体中的相应字段正确使用。

    protected function configureFormFields(FormMapper $formMapper)
    {         $formMapper
                  // Some other added fields

             ->add('district', EntityType::class, [
                 'choice_label' => 'name',
                 'class'       => Districts::class,
                 'placeholder' => '',
             ])

             ->add('city', EntityType::class, [
                 'choice_label' => 'name',
                 'class'       => Cities::class,
                 'placeholder' => '',
             ])       

             ;

这应该已经可以很好地工作了。您现在应该能够拥有一个依赖字段。现在让我们来看看 AJAX 的魔力。

进入您的 AdminClass(与 configureFields-Class 相同)并添加以下内容

 protected function configureRoutes(RouteCollection $collection)
    {    $collection->add('reloadCities', 'reload-cities');

    }

现在您有了可以从 ajax 网址访问的路线。现在创建一个新的 Controller 类，无论您想要在哪里...

<?php

namespace App\Wdm\MainBundle\Controller;

use Symfony\Component\HttpFoundation\Request;
use Sonata\AdminBundle\Controller\CRUDController as BaseController;
use App\Wdm\MainBundle\Entity\Model\Cities;


class CitiesController extends BaseController
{
    public function reloadCitiesAction(Request $request)
    {   $districtid = $request->request->get('id');
        $cities = $this->getDoctrine()->getRepository(Cities::class)->findBy(array("district" => $districtid));
        return $this->render("company/cities.html.twig", array("cities" => $cities));
    }
}

...并且不要忘记在您的 services.yaml 中注册此 Controller ...

  admin.company:
        class: App\Wdm\MainBundle\Admin\CompanyAdmin
        arguments:
            - ~
            - App\Wdm\MainBundle\Entity\Model\Company
            - App\Wdm\MainBundle\Controller\CitiesController (THIS IS THE NEW ROW)

...最后是这个函数中调用的小模板...

// THIS IS THE cities.html.twig

{% for city in cities %}
<option value="{{ city.id }}">{{ city.name }}</option>
{% endfor %}

到目前为止一切顺利。我们现在得到了从 ajax 调用获取数据并将其返回到您的奏鸣曲管理编辑表单的逻辑。现在唯一缺少的是 Sonata admin 编辑模板中所需的 jquery 代码。

进入您的 AdminClass 并插入以下代码(例如在 configureFormFields 之前)

 public function getTemplate($name)
    {
        switch ($name) {
            case 'edit':
                return 'company/cities_admin.html.twig';
                break;
            default:
                return parent::getTemplate($name);
                break;
        }
    }

现在我们创建这个city_admin.html.twig模板来覆盖默认模板

{% extends 'SonataAdminBundle:CRUD:edit.html.twig' %}

{% block form %}
    {{ parent() }}
<script type="text/javascript">

    $(document).ready(function () {
        $("#ID_OF_YOUR_DISTRICT_SELECT_FIELD").change(function () {
            $.ajax({
                url: "{{ admin.generateUrl('reloadCities') }}",
                data: {
                    'id': $(this).val(),
                    'uniquid': '{{ admin.uniqid }}'
                },
                method: 'POST',
                success: function (html) {
                    $("#ID_OF_YOUR_CITY_SELECT_FIELD").html(html);
                },
                error: function (data) {
                    // more code
                }
            });
        });
    });
</script>

{% endblock %}

就是这样。应该像魅力一样发挥作用。