1

我对sencha-touch很陌生,并开始构建简单的登录表单。我的 UI 已准备就绪,但现在我被困在如何为登录请求响应编写代码上。

同样重要的是,我如何指向特定的 url 来发出 POST/GET 请求?

还有如何获取&解析json数据。?

我阅读了 sench-touch 文档,但我不明白如何使用该模型、存储、代理。关于如何创建模型、存储、代理以进行简单登录的建议非常有帮助。

提前致谢。

编辑插入图像:

在此处输入图像描述

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',
            }
        },
    ]
});
4

2 回答 2

1

示例 usando ajax 请求:

使用 ajax 请求的示例:

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) {


        }
    });
于 2014-01-10T12:14:11.237 回答
0

你快到了!

将您的代码添加到成功回调中。注意,如果 ajax 返回 ok 则触发 success() 回调,否则为 failure()。回调 callback() 在这两种情况下都会触发。

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);
    }
});

免责声明。当然,代码没有经过测试......

干杯,奥列格

于 2012-08-30T10:33:56.867 回答