表单提交无效

时间:2012-10-08 09:26:11

标签: sencha-touch extjs sencha-touch-2

我正在使用 Sencha Touch 2 创建登录系统。我在提交表单时遇到问题。它没有从服务器获取响应数据。以下是我的代码

控制器:

Ext.define("MyMobile.controller.LoginController", {
extend: "Ext.app.Controller",
views: ['LoginView'],

config: {
    refs: {
        loginForm: "#loginFormPanel"
    },
    control: {
        'button[action=login]': {
            tap: "authenticateUser"
        }
    }
},

authenticateUser: function (button) {

    this.getLoginForm().submit({
        url: 'login/authenticate',
        method: 'POST',
        success: function (form, result) {
            debugger; //This block of code is not executing even after JSON response
            var jsonoutput = Ext.decode(result);  // json parsing
            Ext.MessageBox.alert('Error', "Success");

        },
        failure: function (form, result) {//This block of code is not executing even after JSON response
            Ext.MessageBox.alert('Error', "Invalid username/password");
        }

    });
}

});

查看

Ext.define("MyMobile.view.LoginView", {
extend: "Ext.form.FormPanel",
alias: "widget.mylogin",
id: 'loginFormPanel',

config: {

    margin: '0 auto',
    name: 'loginform',
    frame: true,
    url: 'login/Authenticate',
    title: 'Login',
    items: [
      {
      xtype: 'fieldset',

      itemId: 'LoginFieldset',
      margin: '10 auto 0 auto ',

      title: '',
      items: [
                {
                    xtype: 'textfield',

                    label: 'User Name',
                    name: 'my-username',
                    required: true,

                    placeHolder: 'Username'
                },
                {
                    xtype: 'emailfield',
                    label: 'Email',
                    name: 'Email'
                },
                {
                    xtype: 'passwordfield',

                    label: 'Password',
                    name: 'my-password',
                    required: true,

                    placeHolder: 'Password'
                }
            ]
  },
    {
        xtype: 'button',
        id: 'loginButton',
        margin: '25 auto 0 auto ',
        style: '',
        maxWidth: 200,
        ui: 'action',
        width: '',
        iconCls: 'user',
        iconMask: true,
        text: 'Login',
        action: 'login'
    }

    ]
}

 });

App.JS

Ext.application({

name: "MyMobile",
appFolder: "myapp",
controllers: ["LoginController"],
views: ['LoginView'],

launch: function () {

   var loginPanel= Ext.create('Ext.Panel', {
        layout: 'fit',

        items: [
            {
                xtype: 'mylogin'
            }
        ]
    });


    Ext.Viewport.add(loginPanel);
}

});

有人可以找出应该是什么问题吗?

以下是我从服务器获取的JSON响应。

{ “用户名”: “穆拉利”, “isAdmin”:真 “isAuthenticated”:真}

即使在获得JSON和200 ok结果后,我的代码表单提交功能也会进入失败回调状态。失败回调函数失败:函数(形式,结果)我得到结果参数作为我的JSON。但为什么它会失败?

1 个答案:

答案 0 :(得分:2)

让您的服务器返回JSON响应,如下所示:

如果成功:

{
    "success":true,
    "UserName":"Murali",
    "isAdmin":true,
    "isAuthenticated":true
}

如果失败:

{
    "success":false
}

请阅读:http://docs.sencha.com/touch/2-0/#!/api/Ext.form.Panel-method-submit