Templates y Temas para ExtJS y Sencha Touch Bleext!
Bleextop! un desktop OpenSource para Ext4 y CodeIgniter http://bit.ly/pUwLJO
Hacer una session de usuario con php y Ext js, ademas de tomar las variables de session y mostrarlas
  • Vote Up0Vote Down jav_978jav_978 February 11
    Posts: 4
    Buenas noches Estimados foreros estoy iniciándome en este maravilloso framework y no se como iniciar una session de usuarios con php, y obtener la varible de session para luego asignarla a un text y mostrar el usuario logueado
  • 6 Answers sorted by
  • Vote Up0Vote Down dapc21dapc21 February 12
    Posts: 9
    Hola jav_978 entiendo, yo estoy pidiendo igual una ayuda algo similar a la tuya. Lo que se me ocurre es que en tu archivo.php cuando conectes al usuario primeramente hagas la consulta que te verifique al usuario (login, password) y que luego esos datos se lo asignes a las variables de sesión, algo así:



    //inicias tu sesión
    session_start();

    //haces tu consulta (select) y almacenas en variables lo que te interese ($usuario, $clave,$permisologia, etc...)
    ...
    //asignas los valores traídos en la consulta tus variables de sesión
    $_SESSION['usuario'] = $usuario;
    $_SESSION['clave'] =$clave;
    ...

    Luego en tu vista pudieras jugar en como imprimes esa variable, pudiera ser que en una etiqueta div metas el valor de esa variable de sesión, por ejm:
    <div> usuario conectado: '<? echo $_SESSION['usuario']; ?>' </div>



    Hay muchas formas de hacerlo, solo tienes que tener un poco de imaginación.
  • Vote Up0Vote Down jav_978jav_978 February 12
    Posts: 4
    <?php<br /> session_start();
    include('php/conexion.php');
    ?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">






    Inicio de Session de Usuario













    Ext.ns('sistema.login');

    sistema.login.Formlogin ={

    init:function(){
    Ext.BLANK_IMAGE_URL = '../../libextjs/ext-3.4.0/resources/images/default/s.gif';
    Ext.QuickTips.init();

    //metodo para loguearse
    function loguear(){
    //validamos el formulario
    var validar = Ext.getCmp('login-form').getForm().isValid();

    if(validar){
    Ext.getCmp('login-form').getForm().submit({
    url:'php/login_user.php',
    method:'POST',
    waitTitle:'Conectando',
    waitMsg:'Validando Usuario..',
    success:function(form,action){
    var data = Ext.util.JSON.decode(action.response.responseText);
    var login = data.login.web;

    if (login == 'user'){
    window.location = 'index.php';
    }
    },
    failure:function(form,action){
    if (action.failureType == 'server'){
    var data = Ext.util.JSON.decode(action.response.responseText);
    Ext.Msg.show({
    title:'Error',
    buttons:Ext.MessageBox.OK,
    icon:Ext.MessageBox.ERROR,
    msg:data.errors.reason
    });
    }
    Ext.getCmp('login-user').focus();
    Ext.getCmp('login-form').getForm().reset();
    }
    });
    }



    //Formulario para el inicio de Sessión
    var loginForm ={
    xtype:'form',
    id:'login-form',
    bodyStyle:'padding:15px;background:transparent',
    border:false,
    url:'php/login_user.php',
    items:[
    {
    xtype:'box',
    autoEl:{
    tag:'div',
    html:'
    image Inicio de Sessión
    '
    }
    },{
    xtype:'textfield',
    id:'login-user',
    name:'login-user',
    fieldLabel:'Usuario',
    allowBlank:false,
    minLength:3,
    maxLenght:8,
    msgTarget:'side',
    validationEvent:true,
    // vtype:'alpha',
    enableKeyEvents:true,
    selectOnFocus:true,
    listeners:{
    keypress:function(t,e)
    {
    if(e.getKey()==13)
    {
    Ext.getCmp('login-pwd').focus();
    }
    }
    }
    },{
    xtype:'textfield',
    id:'login-pwd',
    name:'login-pwd',
    fieldLabel:'Clave',
    inputType:'password',
    allowBlank:false,
    minLength:6,
    maxLenght:8,
    minLengthText:'La clave debe ser mayor de 6 caracteres',
    msgTarget:'side',
    validationEvent:true,
    enableKeyEvents:true,
    selectOnFocus:true

    }],
    buttonAlign:'center',
    buttons:[{
    id:'btn-inicio',
    text:'Inicio',
    formBind:true,

    handler:function(){
    loguear();

    }
    },{
    text:'Cancelar',
    handler:function()
    {
    Ext.getCmp('login-form').getForm().reset(); //Limpia El Formulario
    Ext.getCmp('login-user').focus(); //Ubica el cursor en el campo usuario
    }
    }]
    }

    win = new Ext.Window({
    layout:'form',
    width:340,
    autoHeight:true,
    closeAction:'hide',
    draggable:false,
    resizable:false,
    closable:false,
    items:[loginForm]
    });
    win.show();
    Ext.getCmp('login-user').focus(false,1000);
    }
    }

    Ext.onReady(sistema.login.Formlogin.init,sistema.login.Formlogin);







  • Vote Up0Vote Down jav_978jav_978 February 12
    Posts: 4
    con este codigo del login.php envio los campos al servidor

    <?php <br />include('conexion.php');


    if (!isset($_SESSION)){
    session_start();
    }

    $usr= $_POST["login-user"];
    $password = $_POST["login-pwd"];

    $sql = "SELECT nombre FROM usuarios WHERE usuario = '".$usr."' AND clave = '".$password."'";

    if (!$result = mysql_query($sql)) {

    echo '{"success": false, "errors":{"reason": "Error al intentar conectarse"}}';
    }else{

    $row = mysql_fetch_object($result);

    if ($row){
    // session_start();
    $_SESSION['user'] = $usr;
    echo '{"success": true, "login":{"web": "user"}}';
    }else{
    echo '{"success": false, "errors":{"reason": "Usuario o clave incorrecta verifique"}}';

    }
    }

    ?>
  • Vote Up0Vote Down jav_978jav_978 February 12
    Posts: 4
    mi pregunta es como obtengo la sesion del campo en el index

    <?php<br />
    include('php/conexion.php');

    //iniciamos la session
    session_start();

    if (!$_SESSION){
    echo '
    alert("Usuarion no autenticado");
    self.location="login.php";

    ';

    }
    //$usr= $_SESSION["login-user"];

    ?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">






    Ejercios de Ext JS Capitulo1





















    Ext.ns('sistema.index');

    Ext.BLANK_IMAGE_URL = '../../libextjs/ext-3.4.0/resources/images/default/s.gif';
    Ext.QuickTips.init();

    sistema.index.PanelIndex ={

    init:function(){
    /*
    Ext.get('pie').setStyle('background-color','#CF0000');
    Ext.get('menu').highlight('FF0000',{
    endColor:'0000FF',duration:8
    });

    */

    //Definimos la variable del reloj
    var reloj = new Ext.Toolbar.TextItem({
    id:'reloj',
    text:'00:00:00 AM'
    });

    //programamos el reloj
    var ActualizarReloj = function(){
    Ext.getCmp('reloj').setText(new Date().format('g:i:s A'));
    }

    var tarea = {
    run:ActualizarReloj,// Corremos la Funcionm
    interval:1000 // Cada Segundo
    }

    //Creamos Un nuevo manejador Reloj
    var runner = new Ext.util.TaskRunner();
    runner.start(tarea);


    var fecha = new Ext.Toolbar.TextItem({
    id:'fecha',
    text:'d/n/Y'
    });

    //programaos el reloj
    var ActualizarFecha = function(){
    Ext.getCmp('fecha').setText(new Date().format('d/n/Y'));
    }

    var tareaF = {
    run:ActualizarFecha,// Corremos la Funcionm
    interval:1000 // Cada Segundo
    }

    //Creamos Un nuevo manejador Reloj
    var runnerFecha = new Ext.util.TaskRunner();
    runnerFecha.start(tareaF);

    //Funciom para cerrar la Session
    function confirmarCerrarSession(){
    Ext.MessageBox.confirm('Confirmar','¿ Seguro que deseas Cerrar la Sessión ?',cerrarSession);
    }

    function cerrarSession(btn){
    if (btn == 'yes')
    {
    window.location = 'login.php';
    }
    }


    var Contenedor = new Ext.Panel({
    renderTo:Ext.get('contenido'),
    title:'

    Bienvenidos al Sistema

    ',
    height:492,
    // height:350,
    width:656,
    cls:'my-panel-class',
    layout:'fit',
    html:'
    Módulo Principal
    image
    ',
    bodyStyle: 'padding:10px;',
    bbar:{
    id:'sBar',
    items:[
    '->',
    {
    xtype:'tbtext',
    text:'Hora:'
    },
    reloj
    ,'-',
    {
    xtype:'tbtext',
    text:'Fecha:'
    },
    fecha
    ,'-',
    {
    xtype:'tbtext',
    text:'Usuario:' ********AQUI QUIERO MOSTRAR EL USUARIO LOGUEADO ****"
    },
    {
    id:'Usuario',
    xtype:'tbtext'
    },
    ' ',
    ' ',{
    id:'cerrarSession',
    cls:'x-btn-text-icon',
    icon:'../img/door_out.png',
    xtype:'button',
    text:'Cerrar Sessión',
    listeners:{
    'click':function(scope,valor){
    confirmarCerrarSession();
    }
    }
    }
    ]
    }


    });


    // Colores de Fondo con hoja de estilo localmente usando Ext js
    Ext.get('cabecera').setStyle('background-color','#FFFFFF');
    Ext.get('cuerpo').setStyle('background-color','#336699');

    }
    }

    Ext.onReady(sistema.index.PanelIndex.init,sistema.index.PanelIndex);









  • Vote Up0Vote Down tokkaidotokkaido February 13
    Posts: 395
    sabes? esto fue uno de mis primeros dolores de cabeza con la programación web, en realidad es muy sencillo pero no lograba entender el concepto de asincronico, lo que puedes hacer es lo siguiente:

    a tu panel le asignas un listener al evento afterrender, en el puedes colocar un llamado ajax.request en cuyo success puedes modificar el text que deseas con los datos que recuperes de un php que te devuelva el nombre, por ejemplo algo asi:

    en tu js:

    mipanel.on('afterrender', function(){
    Ext.Ajax.request({
    scope: this,
    url: 'leer_usuario.php',
    success: function(response){
    info = Ext.decode(response.responseText);
    if (info.success){
    //aqui asiegnas el valro que regresas a los componentes que desees
    Ext.getCmp('aqui va el id del text').setValue(info.usuario[0].nombre);
    } else {
    Ext.MessageBox.show({
    title : 'ERROR',
    msg : info.errors.razon,
    icon : Ext.MessageBox.ERROR,
    buttons : Ext.MessageBox.OK
    });
    }
    },
    failure:function(response){
    Ext.MessageBox.show({
    title : 'ERROR',
    msg : response.responseText.errors.razon,
    icon : Ext.MessageBox.ERROR,
    buttons : Ext.MessageBox.OK
    });
    }
    });

    })


    en tu php leer_usuario.php


    <?php
    SESSION_START();
    $usuario = $_SESSION['usuario'];
    $nombre = $_SESSION['nombre'].' '.$_SESSION['apellido'];
    $correo = $_SESSION['correo'];
    $id = $_SESSION['id'];
    $json = '{success:true,usuario:[{"id":1,"user":"'.$usuario.'",';
    $json .= '"id":'.$id.',';
    $json .= '"nombre":"'.$nombre.'",';
    $json .= '"email":"'.$correo.'"}]}';
    echo $json;
    ?>



    espero te sirva (^_^)
  • Vote Up0Vote Down dapc21dapc21 February 13
    Posts: 9
    jav_978 hoy veo todo esto que pones, no sabía que tenías todo eso hecho, pensé que estaba en cero jajaja. Bueno el amigo tokkaido ya te dio la solución. Eso era, un simple Ajax.request que hiciera la consulta que te dije para almacenar en las variables de sesión todo lo que necesites y eso al retornarlo asignarlo con:

    Ext.getCmp('aqui va el id del text').setValue(info.usuario[0].nombre);

    dentro de la función usando el afterrender para que inmediatamente después de la carga se asigne el usuario. Tal cual como te dijo tokkaido.
Add a Comment

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Login with Facebook Sign In with Twitter

Sign In Apply for Membership

Categories

In this Discussion

Poll

No poll attached to this discussion.

Tagged