时间戳

首页 > 解决方案 > Symfony 4 模态形式

symfony - Symfony 4 模态形式

问题描述

我有一个汽车列表，每辆车都有一个按钮，按下按钮可以让我访问一个模式表单来为那辆特定的汽车写一张票。示例：https ://imgur.com/a/t82H9UT

问题是我在我的树枝中集成模态和表单时遇到了一些问题。

我应该填写的表格总共有 4 个输入。前两个应该由汽车传递的与按下按钮相关的数据预先填充，其余的我可以自己填充。但我不知道如何将这些信息从树枝传递到表单。

到目前为止我做了什么：

问题： 按下按钮不会显示任何内容。

我的代码：

index.html.twig

{% block title %}Parking index{% endblock %}

{% block body %}


  <table id="file_export" class="table table-striped table-bordered">
    <tbody>
      {% for voitures in voiture %}            
          <tr>
            <td>
              {{ voitures.matricule }}
            </td>
            <td>
              {{ voitures.parking.libelle }}         
            </td>
            <td>
             <span class="timer" data-expires="{{ voitures.getExpiresAt() }}"></span>
            </td>
            <td>
            <button type="button" class="btn btn-dark" href="{{ path('new_ticket', {'id': voitures.id},{'parking': voitures.parking.id}) }}" data-toggle="modal" data-target="#createmodel" data-whatever="{{ voitures.id }}">ticket</button>
            </td>
          </tr>
        {% endif %}
     {% endfor %}

我的 modal.html.twig 表单：

<div class="modal fade" id="createmodel" tabindex="-1" role="dialog" aria-labelledby="createModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <form>
                   <div class="modal-header">
                    <h5 class="modal-title" id="createModalLabel"><i class="ti-marker-alt m-r-10"></i> ticket for:</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                   </div>
                   <div class="modal-body">
                    {{ form_start(form) }}

                        {{ form_row(form.Matricule, { 'label': 'Matricule' }) }}
                        {{ form_row(form.Parking, { 'label': 'Matricule' }) }}
                        {{ form_row(form.Date, { 'label': 'Date' }) }}
                        {{ form_row(form.montant, { 'label': 'Montant' }) }}

                        <button class="btn">{{ button_label|default('Add') }}</button>
                    {{ form_end(form) }}



                   </div>
                   <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-success"><i class="ti-save"></i> Save</button>
                   </div>
            </form>
    </div>
</div>

最后是我的控制器（不起作用）

    /**
     * @Route("/ticket", name="new_ticket", methods={"GET","POST"})
     */
    public function newTicket(Request $request): Response
    {
        $ticket = new Ticket();
        $form = $this->createForm(TicketType::class, $ticket);
        $form->handleRequest($request);

        if ($form->isSubmitted() && $form->isValid()) {
            $this->addFlash('success','ammende added !');

            $entityManager = $this->getDoctrine()->getManager();
            $entityManager->persist($ticket);
            $entityManager->flush();

            return $this->redirectToRoute('agent');
        }

        return $this->render('Agent/modal.html.twig', [
            'ticket' => $ticket,
            'form' => $form->createView(),
        ]);
    }

这是我找到的解决方案： 我使用渲染将表单集成到我的索引中，它并不完美，但它有效：

         {{render(controller('App\\Controller\\AgentController:newTask')) }}

标签： symfonybootstrap-4doctrinetwigsymfony4

解决方案

您的代码中有几个错误。第一个错误是您在另一个中声明了两种形式。 {{ form_start(form) }}打印<form>标签。第二个问题是您没有将表单关联到汽车。例如，您应该为每辆车渲染一个模态并将其传递给您想要发布的路线。

我在这里留下一个例子

 {% for voitures in voiture %}            
          <tr>
            <td>
              {{ voitures.matricule }}
            </td>
            <td>
              {{ voitures.parking.libelle }}         
            </td>
            <td>
             <span class="timer" data-expires="{{ voitures.getExpiresAt() }}"></span>
            </td>
            <td>
            <button type="button" class="btn btn-dark" href="" data-toggle="modal" data-target="#createmodel" data-whatever="{{ voitures.id }}">ticket</button>
            </td>
          </tr>
          {% set submit_url = path('new_ticket', {'id': voitures.id},{'parking': voitures.parking.id}) %}
          {% include 'modal_form.html.twig' wiht {url: submit_url} 
     {% endfor %}

它的模态可以是：

<div class="modal fade" id="createmodel" tabindex="-1" role="dialog" aria-labelledby="createModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
           {{ form_start(form, {'action': url)}) }}
                   <div class="modal-header">
                    <h5 class="modal-title" id="createModalLabel"><i class="ti-marker-alt m-r-10"></i> ticket for:</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                   </div>
                   <div class="modal-body">
                        {{ form_row(form.Matricule, { 'label': 'Matricule' }) }}
                        {{ form_row(form.Parking, { 'label': 'Matricule' }) }}
                        {{ form_row(form.Date, { 'label': 'Date' }) }}
                        {{ form_row(form.montant, { 'label': 'Montant' }) }}
                   <div class="modal-footer">
                   </div>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-success"><i class="ti-save"></i> Save</button>
                   </div>
             {{ form_end(form) }}
        </div>    
    </div>
</div>

推荐阅读