当前位置: 动力学知识库 > 问答 > 编程问答 >

extjs - sencha-touch: Login request-response

问题描述:

I am very new to sencha-touch & started to build simple Login form.

My UI is ready but now I am stuck on how to write code for login request response.

As important, how can I point to specific url to make POST/GET request?

Also how to get & parse the json data.?

I read the sench-touch documentation but I didnt understood, how to use that model, store, proxy.

Suggestions upon how to create model, store, proxy to make simple login are very helpful.

Thanks in advance.

Edited to insert image:

var loginForm = Ext.create('Ext.form.Panel', {

fullscreen: true,

items: [{

xtype: 'fieldset',

items: [

{

xtype: 'textfield',

name : 'name',

label: 'Username'

},

{

xtype: 'passwordfield',

name : 'password',

label: 'Password'

}

]

}]

});

loginForm.add({

xtype: 'button',

text: 'Login',

ui: 'confirm',

badgeText: '1',

// handler: function(){

// // alert("handler invoked");

// },

listeners : {

tap : function() {

var form = Ext.getCmp('form-id');

var values = form.getValues();

Ext.Ajax.request({

url: 'https://102.XXX.X.XX:XXXX/QuizMasterServer/rest/login',

params: values,

success: function(response){

var text = response.responseText;

Ext.Msg.alert('Success', text);

},

failure : function(response) {

Ext.Msg.alert('Error','Error while submitting the form');

console.log(response.responseText);

}

});

}

}

});

loginForm.add({

xtype: 'toolbar',

// id:'loginPressed',

docked: 'bottom',

// layout: { pack: 'center' },

items: [

{

xtype: 'button',

text: 'Login',

ui: 'confirm',

// action: 'login',

handler: function() {

loginForm.setValues({

name: 'vs',

password: 'vs'

})

}

},

{

xtype: 'button',

text: 'Clear',

ui:'decline',

handler: function() {

loginForm.reset();

}

},

{

xtype: 'button',

centered: true,

text: 'Sign Up',

handler: function() {

alert('New User?');

}

},

{

xtype: 'container',

html: 'New User? ',

style: {

color: 'yellow',

}

},

]

});

网友答案:

You are almost there!

add your code to the success callback. Note, success() callback if fired if ajax returns ok, otherwise failure(). Callback callback() fire in both cases.

Ext.Ajax.request({
    url: 'https://102.XXX.X.XX:XXXX/QuizMasterServer/rest/login',
    params: values,

    success: function(response){
        var text = response.responseText;
        // for example
        var result = Ext.decode(text);  // json parsing
        if (result.ok) {
            //create new widget
            var homeView = Ext.widget('homePage', {...});
            Ext.Viewport.remove(formLogin);
            Ext.Viewport.add(homeView);
            ///... etc
            homeView.show()
        }
        Ext.Msg.alert('Success', text);
    },

    failure : function(response) {
        Ext.Msg.alert('Error','Error while submitting the form');
        console.log(response.responseText);
    }
});

Disclaimer. Of course the code is not tested...

cheers, Oleg

网友答案:

Exemplo usando ajax request:

Example using ajax request:

Ext.Ajax.request({
        url: domain.com/auth/signIn/',
        method: 'post',
        scope: this,
        params: {
            email: username,
            password: password
        },

        success: function (response) {

            var result = Ext.JSON.decode(response.responseText);

            if (result.meta.code==200)
            {

                /**
                 * Salvando dados do usuário em localStorage
                 * Save user data on localStorage
                 */
                window.localStorage.setItem('myID', result.response.id);
                window.localStorage.setItem('email', result.response.email);
                window.localStorage.setItem('token', result.response.token);
                window.localStorage.setItem('fName', result.response.fName);
                window.localStorage.setItem('lName', result.response.lName);
                window.localStorage.setItem('photo', result.response.photo);
                window.localStorage.setItem('gender', result.response.gender);
                window.localStorage.setItem('relationship', result.response.relationship);
                window.localStorage.setItem('interest', result.response.interest);

                this.signInSuccess();                    
                this.verifyDeviceToken(result.response.id, 'signin');

            }
            else
            {

                 this.signInFailure('Error', 'The data reported are invalid');

            }
        },

        failure: function (response) {


        }
    });
分享给朋友:
您可能感兴趣的文章:
随机阅读: