php - Symfony2 不同 JQuery UI 选项卡中的多个表单但单页

Question

我面临一个问题，我可以总结如下：我有一个这样的 TWIG 模板页面（reg.html.twig）：

{% extends "::base.html.twig" %}
{% block body %}
<ul class="tabs">
    <li class="left"><a href="#tab1">tab1</a></li>
    <li class="left"><a href="#tab2">tab2</a></li>
    <li class="left"><a href="#tab3">tab3</a></li>
    <li class="right"><a href="#tab4">tab4</a></li>
</ul>
<div class="tabs_container">
    <div id="tab1" class="blocco-tab">
        <form action="{{ path('AAA') }}" method="post" {{ form_enctype(form) }}>
            <div id="name_field">
                {{ form_row(form.name) }}
            </div><!-- /name_field -->
            <div id="address">
                 {{ form_row(form.addresses[0].road) }}
            </div><!-- /address_field -->
        </form>
    </div>
    <div id="tab2" class="blocco-tab">
        <form action="{{ path('BBB') }}" method="post" {{ form_enctype(form) }}>
            <div id="surname_field">
                {{ form_row(form.surname) }}
            </div><!-- /surname_field -->
        </form>
    </div>
</div> <!-- contenitore_tabs -->
{% endblock %}

字段名称、姓氏和地址属于示例 Symfony2 实体 Person。地址是地址集合的第一个也是唯一的元素（出于其他原因，我需要这个作为集合）

工作的 JS 文件是：

jQuery(document).ready(function() {
    $(".blocco-tab").hide();
    $("ul.tabs li:first").addClass("active").show();
    $(".blocco-tab:first").show();
    $("ul.tabs li").click(function() {
        $("ul.tabs li").removeClass("active");
        $(this).addClass("active");
        $(".blocco-tab").hide();
        var activeTab = $(this).find("a").attr("href");
        $(activeTab).fadeIn();
        return false;
    });
});

实体文件：

class Person {
    protected $name;
    protected $surname;
    protected $addresses;

    public function __construct(){
        $this->addresses = new ArrayCollection();
    }
}

在 DefaultController 中：

public function tab1Action(Request $request){
    $person = new Person();
    $address = new Address();
    $addr_coll = new ArrayCollection();
    $addr_coll->add($address);
    $tab1_type = new Tab1Type();
    $person->setAddresses($addr_coll);
    $form = $this->createForm($tab1_type, $person);
    if ($request->getMethod() == 'POST')
    {
        $form->bindRequest($request);
        if ($form->isValid())
    /*ecc ecc ecc*/
}

public function tab2Action(Request $request){
    $person = new Person();
    $tab2_type = new Tab2Type();
    $form = $this->createForm($tab2_type, $person);
    if ($request->getMethod() == 'POST')
    {
        $form->bindRequest($request);
        if ($form->isValid())
    /*ecc ecc ecc*/
}

实际上，我采取了让每个 FormType 都具有我不需要渲染的所有字段但将“隐藏”和“property_path”=> false 的方式，因为我不能只渲染我想要的字段，因为其他字段会导致错误运行时（它们为空），但我仍然遇到以联合方式处理这两种情况的问题。

将每个表单放在不同的页面（== 不同的路由），使用不同的控制器，一切正常，所以这不是与 symfony 的基本使用相关的问题，而是将 N 个表单与 JQuery UI 集成在一个页面中让我哭。

修复了我必须使用此选项卡，我该如何解决？

我必须做一个动作来处理所有事情吗？
我必须制作一个表格吗？
我错过了什么吗？

在此先感谢，我希望我已经清楚地解释了我的问题。

score 0 · Accepted Answer

您只是将相同的变量用于不同的形式

<div id="tab1" class="blocco-tab">
    <form action="{{ path('AAA') }}" method="post" {{ form_enctype(**form1**) }}>
        <div id="name_field">
            {{ form_row(**form1**.name) }}
        </div><!-- /name_field -->
        <div id="address">
             {{ form_row(**form1**.addresses[0].road) }}
        </div><!-- /address_field -->
    </form>
</div>
<div id="tab2" class="blocco-tab">
    <form action="{{ path('BBB') }}" method="post" {{ form_enctype(**form2**) }}>
        <div id="surname_field">
            {{ form_row(**form2**.surname) }}
        </div><!-- /surname_field -->
    </form>
</div>

score 0 · Accepted Answer

尝试使用单一形式

{% extends "::base.html.twig" %}
{% block body %}
<form action="{{ path('AAA') }}" method="post" {{ form_enctype(form) }}>
<ul class="tabs">
    <li class="left"><a href="#tab1">tab1</a></li>
    <li class="left"><a href="#tab2">tab2</a></li>
    <li class="left"><a href="#tab3">tab3</a></li>
    <li class="right"><a href="#tab4">tab4</a></li>
</ul>
<div class="tabs_container">
    <div id="tab1" class="blocco-tab">
            <div id="name_field">
                {{ form_row(form.name) }}
            </div><!-- /name_field -->
            <div id="address">
                 {{ form_row(form.addresses[0].road) }}
            </div><!-- /address_field -->
    </div>
    <div id="tab2" class="blocco-tab">
            <div id="surname_field">
                {{ form_row(form.surname) }}
            </div><!-- /surname_field -->
    </div>
</div> <!-- contenitore_tabs -->
 </form>
{% endblock %}

然后你在 ocontrolleraaaAction()

public function aaaAction(Request $request){
    $person = new Person();
    $address = new Address();
    $addr_coll = new ArrayCollection();
    $addr_coll->add($address);
    $person->setAddresses($addr_coll);
    $form = $this->createForm(new PersonType(), $person);
    if ($request->getMethod() == 'POST')
    {
        $form->bindRequest($request);
        if ($form->isValid())
    /*ecc ecc ecc*/
}

和表单构建器的类

class PersonType extends AbstractType {

    public function buildForm(FormBuilder $builder, array $options)
    {
        $builder
                ->add('name', null, array())
                ->add('surname', null, array())
                ->add('addresses', null, array())
        ;
    }

    public function getName()
    {
        return 'person';
    }

    public function getDefaultOptions(array $options)
    {
        return array(
            'data_class' => 'Acme\YourBundle\Entity\Person',
        );
    }
}

score 0 · Accepted Answer

正如我之前提到的，我解决了将所有选项卡包装在一个表单中的问题。您的两个解决方案都可以，谢谢您的时间。

Linuxatico

score 0 · Accepted Answer

万一其他人有这个问题，你可以这样解决（我不确定这是否是最优雅的解决方案，但我认为它比为所有东西制作一个大表格更好）。这个例子混合了 profile 和 changePassword FOSUserBundle 形式：

在您的主节目模板中（在我的情况下为 Profile:show.html.twig）：

        {% if profileForm is defined %}
            {% include 'MyBundle:Profile:edit.html.twig' with {'form':profileForm} %}
        {% else %}
            {% render 'MyBundle:Profile:edit' %}
        {% endif %}

重复更改密码：

        {% if passwdForm is defined %}
            {% include 'MyBundle:ChangePassword:changePassword.html.twig' with {'form':passwdForm} %}
        {% else %}
            {% render 'FOSUserBundle:ChangePassword:changePassword' %}
        {% endif %}

在您的控制器中（添加其他）：

if ($form->isValid()) {
    .....
else {
    return $this->container->get('templating')->renderResponse('FOSUserBundle:Profile:show.html.'.$this->container->getParameter('fos_user.template.engine'),
                     array('user' => $user, 'profileForm' => $form->createView()));
        }

相应地添加 profileForm 和 passwdForm。在我的例子中，修改后的控制器是 ProfileController 和 ChangePasswordControllers（FOSUserBundle 覆盖）。

至于您的标签，如果发现任何错误，您可以添加 javascript（或 twig）来打开标签。

希望这可以帮助：）

php - Symfony2 不同 JQuery UI 选项卡中的多个表单但单页

4 回答 4

Related

Reference