Sencha Touch 2计算器实时绑定

Question

正在开发一个具有计算器功能的应用程序：例如，我有4个文本字段，当用户键入第一个字段，第二个字段和第三个字段中的数字时，应用程序将自动计算并给出在用户按下任何按钮的情况下回答第4个字段。  1 + 1 + 1 = 3自动计算3的答案。我的文本字段的代码是：

Ext.define("ikhlas.view.assetallocate", {
    extend: 'Ext.Panel',
    xtype: 'assetpanel',

    config: {
        title: 'Asset',
        iconCls: 'info',
        scrollable: true,
        styleHtmlContent: true,

        items: [{
            layout: 'hbox',
            items: [{
                html: 'Sum 1:',
                flex: 1

            }, {
                xtype: 'textfield',
                flex: 1
            }, ]

        }, {
            xtype: 'spacer',
            height: 10

        }, {
            layout: 'hbox',
            items: [{
                html: 'Sum 2:',
                flex: 1

            }, {
                xtype: 'textfield',
                flex: 1
            }, ]

        }, {
            xtype: 'spacer',
            height: 10

        }, {
            layout: 'hbox',
            items: [{
                html: 'Sum 3:',
                flex: 1

            }, {
                xtype: 'textfield',
                flex: 1
            }, ]

        }, {
            xtype: 'spacer',
            height: 10

        }, ]
    }
});

我的控制器看起来像这样，它仍然是空的：

Ext.define('ikhlas.controller.SubmitController', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {

        },
        control: {


        }
    },

    submitbutton: function () {

    }
});

我的商店和我的模特现在都是空的。谁可以帮我设置它真的让我很难过？

Answer 1

首先，为id这样的每个4 textfield提供xtype:' textfield', id: 'txtField1' 属性，

Submit

等等。 然后， 在您的spacer中添加{ xtype: 'button', text:'Submit', id: 'submitBtn' } 按钮代码，

controller

然后，在您的config:{ refs:{ submitBtn: '#submitBtn', txtField1: '#txtField1', txtField2: '#txtField2', txtField3: '#txtField3', txtField4: '#txtField4' }, control:{ submitBtn: { tap: 'submitBtnTapFn' } } }, submitBtnTapFn : function(){ var value1 = Ext.getCmp('txtField1').getValue(); var value2 = Ext.getCmp('txtField2').getValue(); var value3 = Ext.getCmp('txtField3').getValue(); var value4; value4 = value1 + value2 + value3; Ext.getCmp('txtField4').setValue(value4); } 文件中，像这样写，

{{1}}