Search code examples
cssajaxsymfonymodal-dialogmaterialize

keep materialize CSS modal form open after submit


i'm using a form inside a materialize modal, but when i click on submit button the modal will be closed and redirected, how could i reloading the existing form with empty fields without closing the modal after submitting ?

        <div class="modal" id="docModal{{applications.id}}" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" style="height: 500px;">
            <div class="modal-dialog modal-full-height modal-right modal-notify modal-info" style="margin: 0;" role="document">
          ........

            {{ form_start(form) }}

                <div class="form_group">
                   <label for="{{form.nom.vars.id}}">Nom</label>
                         <input type="text" class="form_control" id="{{form.nom.vars.id}}" name="{{form.nom.vars.full_name}}" value="{{form.nom.vars.value}}" required>
                 {{form_errors(form.nom)}}
                {% do form.nom.setRendered %}
              </div>
                  <!-------BTN AJOUT---------->
                 <input  type="submit" class="btn btn-success" onclick="M.toast({html: 'Lien ajouté !', classes: 'rounded'});" value="Ajouter" style="transform: translate(32em);"
                                    id="carto_cartographiebundle_liendocapp_ajouter" name="carto_cartographiebundle_liendocapp[ajouter]">
                  {% do form.ajouter.setRendered %}
           {{form_end(form)}} 
      </div>
 </div>

Controller

      public function indexAction(Request $request)
       {

    $em = $this->getDoctrine()->getManager();
    $applications = $em->getRepository('CartoBundle:Application')->findAll();
    $lienDocApp = new LienDocApp();
    $form=$this->createForm(LienDocAppType::class, $lienDocApp);
    $form->handleRequest($request);
    if ($form->isSubmitted()&& $form->isValid()){
        $em = $this->getDoctrine()->getManager();
        $em->persist($lienDocApp);
        $em->flush();
        return $this->redirectToRoute('carto_accueil');
    }

    return $this->render('CartoBundle:Accueil:index.html.twig', array(
        'applications'=>$applications,
         'lienDocApp' => $lienDocApp,
        'form' => $form->createView(),
    ));
}

Solution

  • There are two ways to do this.

    1. As Fabian mentions it above, you can use ajax based form submitting to refresh the contents of the modal - it should be relatively easy to do.

    2. You can have the form redirect to the same page and pass a variable back to the page that would tell it load the modal. It may not be perfect because the modal will open after the page is loaded, but there are times one might prefer that. You can look at this question for that: How I can open a materialize modal when a window is ready?