使用弹出表单和 ajax 请求编辑对象答案

【问题标题】：Edit an object with popup form and ajax request使用弹出表单和 ajax 请求编辑对象
【发布时间】：2021-04-29 07:21:01
【问题描述】：

我正在使用 symfony 进行开发（刚刚开始）。我想使用弹出窗口中包含的表单编辑对象。

在我的 javascript 中，我使用 ajax 发送一个“id”数据来查找具有其 id 的对象。然后，我还发送了放入表单中的数据，以便能够修改这个对象（下面的 js 代码）：

    $('.btn-edit').click( function() {

        $(this).val();
        console.log("click edit " + $(this).val());

        let id = $(this).val();
        let DATA = {'id':id};
        let url = '/edit'

        $.ajax({  // Envoie une requête avec en donnée l ID du player.
            type: "POST",
            url: url,
            data: JSON.stringify(DATA),
            contentType: "application/json; charset=utf-8",
            dataType: 'html',
            cache: false,
            success: function (data3) { // résultat de action edit : inclusion du formulaire dans un popup
                $('#modal_detail').html(data3); // récupère le formulaire
                $('#modal-title').html("Modifier player"); //Affiche Le titre de popup
                $('#dataModal').modal("show"); //Affichage du popup

                //envoie des données rentrées dans le formulaire
                $('form').submit(function(e) {
                    e.preventDefault();
                    let $formplayer = $(this);
                    let route = '/edit';
                    let datas = $formplayer.serialize();
                    $.post({
                        type: 'post',
                        url: route,
                        data: datas,
                        success: function(result) {
                            console.log(result);
                            $('.formMessage').addClass('success').html(result);
                            location.replace('/');
                        },
                        error: function(err){
                            $('.formMessage').addClass('success').html(err);
                        }
                    });


                });

            }
        });

    });

我的控制器代码如下：

/**
     * @Route ("/edit", name = "edit")
     *
     * @param $request
     *
     * @return RedirectResponse
     *
     * @throws JsonException
     */
    public function editPlayer(Request $request, PlayerRepository $playerRepository): Response
    {
        $em = $this->getDoctrine()->getManager();

        $post_data = json_decode($request->getContent(), true, 512, JSON_THROW_ON_ERROR);
        $id = $post_data['id'];

        $player = $this->getDoctrine()
                ->getRepository(Player::class)
                ->find($id);

        $form = $this->createForm(PlayerFormType::class, $player);

        $form->handleRequest($request);

        if ($form->isSubmitted() && $form->isValid()) {
            $em = $this->getDoctrine()->getManager();
            $em->persist($player);
            $em->flush();

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

        return $this->render('manager_temp/edit.html.twig', [
            'player' => $player,
            'form' => $form->createView(),
        ]);
    }

我认为用户在表单中填写的数据在我的控制器中没有得到很好的处理。当控制器接收到它想用 json 解码以知道 id 的表单数据时。但是我已经发送了id ...

我知道我的问题有点模糊 :) 但我需要帮助我被困住了......

【问题讨论】：

标签： javascript json ajax symfony request

【解决方案1】：

其实并不难。您可以使用 URL 发送 id：

AJAX：

let DATA = {'id': id};
let url = '/ edit /' + id;

在控制器中：

* @Route ("/ edit / {id}", name = "edit")

所以你可以在没有 JSON 的情况下发送数据表单

【讨论】：