symfony2 modal login

[diokhan]

Boas pessoal,

Após uma longa ausência voltei a actividade.

Estou aqui com um problema, eu já programo em PHP a cerca de 5/6 anos, mas só recentemente comecei a utilizar o Symfony2. Tenho de admitir que adaptei-me bem, mas agora que comecei a tentar utilizar o jQuery Ajax e assim as coisas começaram a baralhar-me.

Eu quero colocar o meu login com modal, se introduzir os dados certos corre tudo bem, sem problemas, o meu problema é:

- ao introduzir dados invalidos ou mesmo em branco eu queria que fizesse o return para dentro do modal, a aparecer a mensagem de erro como é obvio, para o utilizador voltar a tentar, mas o que esta a acontecer de momento é que ao introduzir os dados errados ele envia para outra pagina que tenho de login estática sem o modal.

Espero ter-me feito perceber. Se for preciso deixar alguma parte do código para demonstrar o que tenho feito basta dizer que eu coloco aqui o essencial.

Desde já obrigado  😉

[yoda]

Sem código ..

[diokhan]

Espero ter-me feito perceber. Se for preciso deixar alguma parte do código para demonstrar o que tenho feito basta dizer que eu coloco aqui o essencial.

Desde já obrigado  😉

eu disse que se fosse preciso codigo para explicar melhor que era so dizer que eu aqui colocava. Amanha quando chegar a empresa ja deixo aqui a parte importante do codigo

[diokhan]

Boas,

Como disse ontem, hoje deixo aqui a parte do codigo que faz o login, espero que alguem me possa ajudar.

esta é a parte do menu, onde chamo o login

{% if not is_granted('ROLE_USER') %}
	<ul>
		<li><a href="{{ path('home') }}">Home</a></li>
		<li><a href="{{ path('new_user') }}">Register</a></li>
		<li><a href="#" id="login_link" target="_self">Login</a></li>
	</ul>
{% endif %}
...
<div id="login_form" style='display:none'>
<div id="status" align="left">
	<center><h1><img src="{{ asset('../web/images/key.png') }}" align="middle"> LOGIN</h1> 
		<div id="login_response"><!-- spanner --></div> 
	</center>
	<form action="{{ path('login_check') }}" method="post">
		<input type="hidden" name="_target_path" value="/members" />

		<label>User</label>
		{% if last_username is defined %}
			<input type="text" id="username" name="_username" value="{{ last_username }}" /><br />  
		{% endif %}
		{% if last_username is not defined %}
			<input type="text" id="username" name="_username" value="" /><br />
		{% endif %}
		<label>Password</label>
		<input type="password" id="password" name="_password" /><br />  

		<label> </label><input type="submit" name="login" value="Login" />

		<div id="ajax_loading">
			<img align="middle" src="{{ asset('../web/images/spinner.gif') }}"> Processing...
		</div>
	</form>
</div>
</div>

aqui fica a parte do javascript:

// When DOM is ready
var $login = jQuery.noConflict();
$login(document).ready(function(){
// Launch MODAL BOX if the Login Link is clicked
$login("#login_link").click( function(){ $login('#login_form').modal(); });

// When the form is submitted
$login("#status > form").submit( function(){  
	// Hide 'Submit' Button
	$login('#submit').hide();

	// Show Gif Spinning Rotator
	$login('#ajax_loading').show();

	// 'this' refers to the current submitted form  
	var str = $login(this).serialize();  

	// -- Start AJAX Call --
	$login.ajax({
	    type: "POST",
	    url: $(this).attr("action"),  // Send the login info to this page
      		data:str,
	    success: function(msg){
		$login("#status").ajaxComplete(
			function(event, request, settings){  
				// Show 'Submit' Button
				$login('#submit').show();

				// Hide Gif Spinning Rotator
				$login('#ajax_loading').hide();  

				// LOGIN OK?
				if(msg == 'OK'){  
					var login_response = '<div id="logged_in">' +
						'<div style="width: 350px; float: left; margin-left: 70px;">' + 
						'<div style="width: 40px; float: left;">' +
						'<img style="margin: 10px 0px 10px 0px;" align="absmiddle" src="images/ajax-loader3.gif">' +
						'</div>' +
						'<div style="margin: 10px 0px 0px 10px; float: right; width: 300px;">'+ 
						"You are successfully logged in! <br /> Please wait while you're redirected...</div></div>";  

						$login('a.modalCloseImg').hide();  
						$login('#simplemodal-container').css("width","500px");
						$login('#simplemodal-container').css("height","120px");
						$login(this).html(login_response); // Refers to 'status'

						// After 2 seconds redirect
						setTimeout('go_to_private_page()', 2000); 
				// ERROR?
				}else{  
					var login_response = msg;
					$login('#login_response').html(login_response);
				}  
			});  
		}
	}); // -- End AJAX Call --
	return false;
}); // end submit event
});

e o controller onde efectua a verificaçao para o login:

class SecurityController extends Controller{
    public function loginAction(){
    	$request = $this->getRequest();
        $session = $request->getSession();

        // get the login error if there is one
        if ($request->attributes->has(SecurityContext::AUTHENTICATION_ERROR)) {
            $error = $request->attributes->get(SecurityContext::AUTHENTICATION_ERROR);
        } else {
            $error = $session->get(SecurityContext::AUTHENTICATION_ERROR);
        }

        return $this->render('AcmeStoreBundle:Security:login.html.twig', array(
            // last username entered by the user
            'last_username' => $session->get(SecurityContext::LAST_USERNAME),
            'error'         => $error,
        ));
    }

public function memberAction(){
	return $this->render('AcmeStoreBundle:Member:member.html.twig');
}
}

basicamente, o que acontece é, ele do ajax envia a informaçao para o meu controller, mas depois nao retorna para o ajax, e nao estou a conseguir fazer essa ligaçao, eu sei que no controller ele tem um return para o login.html.twig, mas só esta assim porque ainda nao consegui descobrir forma de retornar a informaçao para o ajax, mesmo para mostrar a mensagem que o login esta correcto e que ira ser redirecionado e para mostrar a mensagem que os dados sao invalidos.

[yoda]

http://www.symfony-project.org/book/1_0/11-Ajax-Integration

[diokhan]

Desde já obrigado pelo link. Consegui colocar a funcionar, sendo que reparei que quando estou a trabalhar no linux, no localhost, o site fica mais "rápido" do que quando estou a trabalhar também no localhost.

Mas esta a funcionar obrigado 😉

[psaid]

Olá,

Preciso de fazer o mesmo podes ajudar? Como foi a tua solução?