Symfony redirect by ajax - ajax

Question

The page login use ajax, in controller response in view web browser {"response":true,"data":{"from":"apachecms_api_login_submit","to":"/dashboard"}} and not redirect.
function to ajax when success
function beforeSuccess(data){
if(data.data.from=='apachecms_api_login_recovery_submit'){
loading.hide();
$.toast({
heading: "{{ 'success' | trans }}",
text: "{{ 'forgot.password.sending' | trans }}",
position: 'top-right',
icon: 'success',
hideAfter: 5000,
stack: 10
});
changeForm('login')
}else if(data.data.from=='apachecms_api_login_submit'){
location.href=data.data.to;
}else if(data.data.from=='apachecms_api_login_create_submit'){
location.href=data.data.to;
}
}
Whats happend?

Answer 1

LoginController.php extends BaseController
public function loginAction(Request $request){
$form=$this->createForm(LoginType::class, null,array('action'=>$this->generateUrl('apachecms_api_login_submit'),'method' => 'POST'));
$form->handleRequest($request);
if($errors=$this->ifErrors($form)) return $errors;
try {
$entity = $this->getDoctrine()->getRepository('ApachecmsBackendBundle:Customer')->findOneBy(array('email'=>$form->get('_username')->getData(),'isDelete'=>false));
if(!$entity)
throw new Exception(null,200);
$encoder_service = $this->get('security.encoder_factory');
$encoder = $encoder_service->getEncoder($entity);
if(!$encoder->isPasswordValid($entity->getPassword(), $form->get('_password')->getData(), $entity->getSalt()))
throw new Exception(null,200);
$token = new UsernamePasswordToken($entity, $form->get('_password')->getData(), "main", $entity->getRoles());
$this->get("security.token_storage")->setToken($token);
$event = new InteractiveLoginEvent($request, $token);
$this->get("event_dispatcher")->dispatch("security.interactive_login", $event);
return $this->responseOk(array('from'=>'apachecms_api_login_submit','to'=>$this->generateUrl('apachecms_frontend_dashboard'))); // HERE RETURN RESPONSE
}catch (Exception $excepcion) {
return $this->responseFail(array(array('property'=>'_username','code'=>'invalid_credentials','message'=>$this->get('translator')->trans('invalid.credentials'),'data'=>null)),200);
}
}
BaseController.php
public function responseOk($data=array(),$code=200){
try{
// if(!$data)
// throw new Exception('No se encontró el registro',200);
return new Response($this->get('jms_serializer')->serialize(
array('response'=>true,'data'=>$data),
'json',$this->context),$code);
}catch (Exception $excepcion) {
return $this->responseFail(array(array(
'property'=>null,
'message'=>$excepcion->getMessage(),
'code'=>'not_found',
'data'=>null
)),$excepcion->getCode());
}
}
index.html.twig <= Login Page
{{ form_start(formLogin, {'attr': {'id':'loginform','novalidate':'novalidate','class':'form-horizontal form-material sendToApi login'} }) }}
<div class="form-group">
<div class="col-xs-12">
{{form_widget(formLogin._username)}}
<small class="text-danger error">{{ form_errors(formLogin._username) }}</small>
</div>
</div>
<div class="form-group">
<div class="col-xs-12">
{{form_widget(formLogin._password)}}
<small class="text-danger error">{{ form_errors(formLogin._password) }}</small>
</div>
</div>
<div class="form-group row">
<div class="col-md-12">
<div class="checkbox checkbox-info pull-left p-t-0"></div>
<a href="javascript:changeForm('recovery')" id="to-recover" class="text-dark pull-right">
<i class="fa fa-lock m-r-5"></i> {{ 'forgot.password' | trans }}</a>
</div>
</div>
<div class="form-group text-center">
<div class="col-xs-12 p-b-20">
{{form_widget(formLogin.submit,{ 'attr':{ 'class':'btn btn-block btn-lg btn-info btn-rounded','secondary-label':'loading' | trans}})}}
</div>
</div>
{{ include('ApachecmsFrontendBundle::Login/social.html.twig') }}
<div class="form-group m-b-0">
<div class="col-sm-12 text-center">
{{ 'not.account' | trans }}
<a href="javascript:changeForm('register')" class="text-info m-l-5">
<b>{{ 'register' | trans }}</b>
</a>
</div>
</div>
{{ form_end(formLogin) }}
Ajax
// pre-submit callback
function showRequest(formData, form, options) {
loading.show('{{ 'loading' | trans }}');
var url = form.attr("action");
var method = form.attr("method").toUpperCase();
var dataForm = form.serialize();
var submitBtn = form.closest('form').find(':submit');
var inputs=form.closest('form').find(':input:not(.dropify)');
inputs.removeClass('error');
inputs.next('small').html('');
BtnSecondaryLabel=submitBtn.attr('secondary-label');
BtnHtml=submitBtn.html();
submitBtn.html('<i class="fa fa-gear fa-spin"></i> '+BtnSecondaryLabel);
submitBtn.attr('disabled',true);
return true;
}
// post-submit callback
function showResponse(data, statusText, xhr, form) {
var submitBtn = form.closest('form').find(':submit');
submitBtn.attr('disabled',false);
submitBtn.html(BtnHtml);
if(data.response==true){
beforeSuccess(data);
}
}
$(function (){
var options = {
beforeSubmit: showRequest, // pre-submit callback
success: showResponse // post-submit callback
};
$( "form.sendToApi" ).ajaxForm(options); <= capture class to form sendToApi
})
function beforeSuccess(data){
if(data.data.from=='apachecms_api_login_recovery_submit'){
loading.hide();
$.toast({
heading: "{{ 'success' | trans }}",
text: "{{ 'forgot.password.sending' | trans }}",
position: 'top-right',
icon: 'success',
hideAfter: 5000,
stack: 10
});
changeForm('login')
}else if(data.data.from=='apachecms_api_login_submit'){
location.href=data.data.to;
}
}