Esta aplicação utiliza a função sc_url_library do Scriptcase para incluir bibliotecas CSS do Bootstrap, e utiliza código AJAX e JQuery para acessar um webservice criado em outra aplicação que realiza a validação do usuário e senha digitados.
Detalhes da aplicação
1. Estamos utilizando uma aplicação Blank para exibir a tela de login e incluir a biblioteca do Bootstrap:
2. Na aplicação teremos o seguinte código:
Blank
?>
<html>
<head>
<title>Bootstrap Login</title> <!-- Inclui as bibliotecas do Jquery e Bootstrap -->
sc_include_lib("jquery");
<link rel="stylesheet" type="text/css" href="<?php echo sc_url_library('prj', 'bootstrap-3.3.2-dist', 'css/bootstrap.min.css'); ?>" />
<link rel="stylesheet" type="text/css" href="<?php echo sc_url_library('prj', 'bootstrap-3.3.2-dist', 'css/style1.css'); ?>" /> <!-- Início de função AJAX/JQuery que fará a chamada ao webservice de validação do usuário -->
<script>
function validateLogin()
{
$('#errormsg_0_Passwd').html('');
$.ajax({
type: 'POST',
async: false,
url: '../user/',
data: 'option=validate_login&str_login=' + $("#form-login").val() + '&str_password=' + $("#form-password").val(),
success: function(html_retorno)
{
if(html_retorno == "ok")
{
window.location='../menu/';
}
else
{
$('#errormsg_0_Passwd').html(html_retorno);
}
}
});
}
</script> <!-- Fim de função AJAX/JQuery que fará a chamada ao webservice de validação do usuário -->
</head>
<body>
<!-- Início de layout da página de Login -->
<div class="container">
<div class="row">
<div class="col-sm-6 col-md-4 col-md-offset-4">
<h1 class="text-center login-title">Sign in to continue to Login</h1>
<div class="account-wall">
<img class="profile-img" src="https://lh3.googleusercontent.com/-OJ26yjLQ8mo/AAAAAAAAAAI/AAAAAAAAAHg/9aw8LXIfn5I/s120-c/photo.jpg?sz=120"
alt="">
<form class="form-signin">
<input type="text" class="form-control" id="form-login" placeholder="Email" required autofocus>
<input type="password" class="form-control" id="form-password" placeholder="Password" required>
<span role="alert" class="error-msg" id="errormsg_0_Passwd"></span>
<input type="button" value="Sign in" class="btn btn-lg btn-primary btn-block" onclick="validateLogin()">
<label class="checkbox pull-left">
<input type="checkbox" value="remember-me"> Remember me
</label>
<a href="#" class="pull-right need-help">Need help? </a><span class="clearfix"></span>
</form>
</div>
<a href="#" class="text-center new-account">Create an account </a>
</div>
</div>
</div> <!-- Fim de layout da página de Login -->
</body>
</html>
<?php
Aplicação de serviço de validação de usuário
3. O código acima realiza o acesso à aplicação "/user/", responsável pela validação do login e senha digitados. Esta aplicação será uma Blank contendo o seguinte código:
Blank "user"
if(isset($_POST['option']) && !empty($_POST['option']))
{ // Entra na condição se os parâmetros tiverem sido recebidos corretamente da aplicação anterior.
$str_return = "";
// Verifica a opção clicada pelo usuário.
switch($_POST['option'])
{
case 'validate_login': // Opção de validação de usário e senha.
sc_lookup(rs, "SELECT COUNT(*) FROM sec_users WHERE login = " . sc_sql_injection($_POST['str_login']) . " AND pswd = " . sc_sql_injection($_POST['str_password']));
