表单提交不起作用

问题描述 投票:2回答:1

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

Controller:

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响应。

{“ UserName”:“ Murali”,“ isAdmin”:true,“ isAuthenticated”:true}

即使获得JSON和200 OK的结果,我的代码表单提交功能也会进入失败回调。在失败回调函数failure:function(form,result)中,我将结果参数作为JSON。但是为什么它失败了?

sencha-touch extjs sencha-touch-2
1个回答
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

© www.soinside.com 2019 - 2024. All rights reserved.