دورة SYMFONY 4 للمبتدئين الدرس الحادي عشر


فهاد الدرس الحادي عشر من دورة symfony 4 غادي نشوفوا كيفاش نديرو تعديل على article باستعمال ل id ديالو غادي نشوفوا كيفاش نزيدو فورم التعديل من بعد غادي نديرو التعديل على ل article لي بغينا.


1- إضافة ل fonction edit فل controller

غادي نمشي ل HelloController وغادي نزيد fonction edit لي غادي تكون مسؤولة على التعديل ولي غادي تاخد request و ل article لي غادي نديرو عليه تعديل ولي كنسترجعوه بل id ديالو.

الكود لي داخل ل fonction edit هو نفس الكود ديال ل fonction add فقط الملف لي غادي يعرض الفورم  بدلناه من add ل edit.

وعندنا أيضا route لي زدناه فوق ل fonction ولي عطيناه الرابط لي فيه ل id وأيضا الإسم لي حددناه ف article_edit.

الكود لي غادي تزيد ف HelloController هو :


                                //
/**
    * @Route("/hello/edit/{id}", name="article_edit")
    */
    public function edit(Article $article,Request $request){
        $form = $this->formFactory->create(ArticleType::class,$article);
        //get request
        $form->handleRequest($request);
        //check if form is valid
        if($form->isSubmitted() && $form->isValid()){
            //add data to database
            $this->entityManagerInterface->flush();
            //redirect user to hello index
            return new RedirectResponse(
                $this->router->generate('hello')
            );  
        }
        return $this->render('edit.html.twig',[
            'form' => $form->createView()
        ]);
    }
                            

2- إضافة الملف edit.html.twig

ف dossier templates زيد ملف جديد سميه edit.html.twig فيه غادي يكون الفورم ديال التعديل ولي غادي نعرضوه بنفس الطريقة لي درنا فالإضافة.

الكود ديال الملف edit.html.twig هو :

                                //
{% extends 'base.html.twig' %}

{% block title %}Modifier un article{% endblock %}

{% block body %}
    <div class="row mt-4">
        <div class="col-md-6 mx-auto">
            <div class="card text-default bg-light">
              <div class="card-body">
                <h4 class="card-title">Modifier un article</h4>
                <hr>
                {{ form(form) }}
              </div>
            </div>
        </div>    
    </div>
{% endblock %}
                            

3- إضافة رابط التعديل فالصفحة الرئيسية

غادي نمشي للملف hello.twig.html تما غادي نزيد الرابط ديال التعديل قدام كل article كنزيد الرابط ولي كياخد ل id ديال ل article والإسم ديال route لي هو article_edit كيف كتشوف فالصورة :


يلا ضغطتي على modifier غادي يديك لفورم التعديل :



ويلا دخلتي قيم جديدة غادي تدير التعديل على ل article.

الكود ديال hello.html.twig بعد التعديل هو :

                                //
{% extends 'base.html.twig' %}
    {% block title %}Articles{% endblock %}
    {% block body %}
        <div class="row mt-4">
            <div class="col-md-6 mx-auto">
                <d3 class="card bg-light rounded">
                    <div class="container-fluid">
                        <h3 class="card-title text-default p-4">
                            Articles
                        </h3>
                        <hr>
                        <a href="{{path('article_add')}}" class="btn btn-outline-primary float-right text-primary">Ajouter</a>
                    </div>
                    <div class="card-body mt-2 rounded">
                        {% for post in posts %}
                            <div class="media">
                                <img class="mr-3 rounded" src="https://picsum.photos/100/100" alt="">
                                <div class="media-body">
                                    <h5 class="mt-0">{{post.title}}</h5>
                                    {{post.body}}
                                </div>
                                <a href="{{path('article_edit',{'id':post.id})}}" class="btn btn-outline-warning btn-sm float-right text-warning  mr-2">Modifier</a>
                            </div>
                            <hr>
                        {% endfor %}
                    </div>
                    </div>
                </div>
            </div>
        </div>
    {% endblock %}