0

i have a modal that contains a form 

    <div class="modal-header">
            <a href="#" class="float-right" data-placement="left" title="close" data-dismiss="modal">
                <i class="glyph-icon icon-remove"></i>
            </a>
        </div>
<div class="modal-body">
<form id="FormInterview1" class="left-side" action="{{ path('ts_admin_HMaffectCandidate',{'id':id})}}"  method="post"{{form_enctype(form1) }}>
 <div class="form-row">
                <div class="form-label col-md-4">
                    <label for="">
                       {{form_label(form1.evaluators)}}
                    </label>
                </div>
                <div class="form-input col-md-8">
                    {{form_widget(form1.evaluators,{'attr': {'class': 'chosen-select'}})}}
                </div>
            </div>           
                <div class="form-row">
                <div class="form-label col-md-4">
                    <label for="">
                       {{form_label(form1.competances)}}
                    </label>
                </div>
                <div class="form-input col-md-8">
                    {{form_widget(form1.competances,{'attr': {'class': 'chosen-select'}})}}
                </div>
            </div>
     <input type="submit" onclick="validateInterview1();" value="Submit" name="submitActionInt1" class="btn medium primary-bg" />                     
  </div>
     {{ form_rest(form1) }}
</form>
</div>
<div class="modal-footer">

        <button type="button" data-dismiss="modal" aria-hidden="true"  class="center btn medium primary-bg">Close</button>
    </div>

i use ajax to submit this modal

    <script>
        function validateInterview1() {
    var data = $("#FormInterview1").serialize() ;
                $.ajax({
                        type: 'POST',
                        data: data,
                        url:$("#FormInterview1").attr('action'),
                        beforeSend: function () {
                        document.getElementById('loaderInt1').style.display = 'block';
                        },
                        success: function (data) {
                        $('#form1').html(data);
                      document.getElementById('loaderInt1').style.display = 'none';
                       },
                        error: function ()
                        {  
                        alert('Error ajax');
   document.getElementById('loaderInt1').style.display = 'none';
                        }
                });
        }
    </script>

in my controller i persist the new data 

 if ($request->getMethod() == 'POST') {
               if ($this->getRequest()->request->get('submitActionInt1') == 'Submit') {
                $em = $this->getDoctrine()->getManager();
                $form1->bind($request);
                if ($form1->isValid()) {
                $interview1->setState(0);
                $candidate->setInterview1($interview1);
                $em->persist($candidate);
                $em->flush();
                 }  
              }
              return  $this->render('TSAdminBundle:Status:FormInterview1.html.twig'
                            , array(
                        'id' => $id,
                        'form1' => $form1->createView()));
            }

after the persist i want to send a new html page contains the new form and display it into the modal without close the modal and without redirect me to an other url.

this code work fine but the problem is after the submit the controller return a new page and put it in the modal but redirect me to other url.

ram
  • 15
  • 1
  • 7

1 Answers1

0

You might want to return false; in validateInterview1():

function validateInterview1() {

    var data = $("#FormInterview1").serialize();
    $.ajax(...);

    return false;
}

And add a return here: 

<input type="submit" onclick="return validateInterview1();"  />

This is to prevent the default action (submit the form) to happen after you post your data.

NB : Since you're using jQuery, you might be tempted to use e.preventDefault(), this answer has a very complete explanation on the differences.

tchap
  • 3,412
  • 3
  • 29
  • 46