如何在sencha touch中更改文本字段的值？

Question

我正在使用phonegap中的條形碼掃描儀插件來掃描條形碼。 獲得值后，我想在文本字段中顯示它。 下面是我的文本字段代碼：

{
     xtype : 'textfield',
      id : 'barcodetextfield',
     width : 300,
     margin : '0 0 0 10',
     labelWidth : '40%',
     label : 'Enter Barcode'                                             
}

在控制器中，我正在嘗試在文本字段中設置條形碼值。

window.plugins.barcodeScanner.scan(function(result) {
    this.getBarcodebox.setValue(""+result.text);
 }, function(error) {
     alert("Scanning failed: " + error);
 });

我將ref放在控制器中，如下所示：

barcodebox : '#barcodetextfield',

這是我的整個控制器代碼：：

Ext.define('MyApp.controller.MyController', {
extend : 'Ext.app.Controller',
config : {
    refs : {
        TitlePanel : 'login',
        dashboardpanel : 'dashboard',
        ConsumerSignup : 'consumersignup',
        AddtoWishlog : 'addwishlog',
        wishlogsummary : 'wishlogsummarylist',
        FeedbackSummary : 'feedbacksummarylist',
        ConsumerSignin : 'Consumersignin',
        barcodebox : '#barcodetextfield',
        labelid : 'title'
    },
    views : [ 'TitlePanel', 'dashboardpanel', 'ConsumerSignup',
            'AddtoWishlog', 'wishlogsummary', 'FeedbackSummary',
            'ConsumerSignin' ],

    control : {
        "#LoginBtn" : {
            tap : 'onLoginButtonTap'
        },

        "#wishloghomebutton" : {
            tap : 'onWishlogHomeButtonTap'
        },

        "#feedbacksummaryhomebutton" : {
            tap : 'onFeedbackHomeButtonTap'
        },

        "#wishlogbtn" : {
            tap : 'onWishlogButtonTap'
        },

        "#Feedbackbtn" : {
            tap : 'onFeedbackButtonTap'
        },

        "#signup" : {
            tap : 'onSignupButtonTap'
        },

        "#capturebtn" : {
            tap : 'onCaptureButtonTap'
        },

        "#consumersignuphomebutton" : {
            tap : 'onConsumerSignupHomeButtonTap'
        },

        "#selectphoto" : {
            tap : 'onSelectPhotoButtonTap'
        },

        "#scanbutton" : {
            tap : 'onScanButtonTap'
        }

    }
},

slideLeftTransition : {
    type : 'slide',
    direction : 'left'
},
slideRightTransition : {
    type : 'slide',
    direction : 'right'
},

onLoginButtonTap : function(button, e, options) {

    Ext.Viewport.setActiveItem(this.getDashboardpanel(),
            this.slideLeftTransition);
    // this.getLabelid.setHtml('Dashboard');
},

onWishlogButtonTap : function(button, e, options) {

    Ext.Viewport.setActiveItem(this.getWishlogsummary(),
            this.slideLeftTransition);
},

onFeedbackButtonTap : function(button, e, options) {

    Ext.Viewport.setActiveItem(this.getFeedbackSummary(),
            this.slideLeftTransition);
},

onSignupButtonTap : function(button, e, options) {

    Ext.Viewport.setActiveItem(this.getConsumerSignup(),
            this.slideLeftTransition);
},

onWishlogHomeButtonTap : function(button, e, options) {

    Ext.Viewport.setActiveItem(this.getDashboardpanel(),
            this.slideRightTransition);
},

onFeedbackHomeButtonTap : function(button, e, options) {

    Ext.Viewport.setActiveItem(this.getDashboardpanel(),
            this.slideRightTransition);
},

onConsumerSignupHomeButtonTap : function(button, e, options) {

    Ext.Viewport.setActiveItem(this.getDashboardpanel(),
            this.slideRightTransition);
},

onCaptureButtonTap : function(button, e, options) {
    navigator.camera.getPicture(onPhotoURISuccess, onFail, {
        quality : 100,
        destinationType : Camera.DestinationType.FILE_URI
    });

    function onPhotoURISuccess(imageURI) {
        // console.log(imageURI);
        var largeImage = document.getElementById('capturedimage');
        largeImage.style.display = 'block';
        largeImage.src = imageURI;
    }

    function getPhoto(source) {
        // Retrieve image file location from specified source
        navigator.camera.getPicture(onPhotoURISuccess, onFail, {
            quality : 100,
            destinationType : destinationType.FILE_URI,
            sourceType : source
        });
    }
    function onFail(message) {
        alert('It is failed: ' + message);
    }

},

onSelectPhotoButtonTap : function(button, e, options) {
    navigator.camera.getPicture(onPhotoURISuccess, onFail, {
        quality : 50,
        destinationType : navigator.camera.DestinationType.FILE_URI,
        sourceType : navigator.camera.PictureSourceType.PHOTOLIBRARY
    });

    function onPhotoURISuccess(imageURI) {
        // console.log(imageURI);
        var largeImage = document.getElementById('capturedimage');
        largeImage.style.display = 'block';
        largeImage.src = imageURI;
    }

    function getPhoto(source) {
        // Retrieve image file location from specified source
        navigator.camera.getPicture(onPhotoURISuccess, onFail, {
            quality : 100,
            destinationType : destinationType.FILE_URI,
            sourceType : source
        });
    }
    function onFail(message) {
        alert('It is failed: ' + message);
    }
},

onScanButtonTap : function(button, e, options) {
    window.plugins.barcodeScanner.scan(function(result) {
        this.getBarcodebox().setValue(""+result.text);

// alert（“我們收到了條形碼\\ n” + //“結果：” + result.text）; }，function（error）{alert（“掃描失敗：” +錯誤）; }）; }}）;

當我在對話框中顯示值時，它顯示正確。 但無法在文本框中設置。 我如何設置條形碼？ 請幫忙。

Answer 1

應該：

    this.getBarcodebox.setValue(""+result.text);

不是方法調用嗎？

    this.getBarcodebox().setValue(""+result.text);

當然，這是假設您已在控制器中添加barcodebox作為ref ：

    refs: {
        barcodebox: '#barcodtext'
    }

注意id: #barcodtext （缺少“ e”）中的錯字，並確保它等於用ref選擇器指定的值。

-編輯

看起來this超出了您的回調范圍，因此沒有引用您的控制器。 您可以嘗試以下操作：

window.plugins.barcodeScanner.scan(function(result) {
    var controller = Ext.app.Application.getController('MyController');
    controller.getBarcodebox.setValue(""+result.text);
}, function(error) {
    alert("Scanning failed: " + error);
});

Answer 2

而不是使用barcodebox : '#barcodetextfield',在refs嘗試使用getCmp()

var bc = Ext.getCmp('barcodetextfield');

之后bc.setvalue(''+result.text);

我希望這有幫助..