Question

我有一个相当容易的问题，我需要一个解决方案。我尝试了不同的选择，但没有取得任何好的结果。我想要做的是，在一个类中，添加一个文本字段并通过javascript放入一个值。

例如，我得到了这段代码：

Ext.define('project.view.viewexample', {
extend: 'Ext.Panel',
xtype: 'gps',

config: {
    styleHtmlContent: true, 
    scrollabe: 'vertical',
    title: 'GPS',
    tpl: ''
},
constructor: function() {
    this.getPosition();
},
getPosition: function() {
    var geo = Ext.create('Ext.util.Geolocation', {
        autoUpdate: false,
        listeners: {
            locationupdate: function(geo) {
                alert('New latitude: ' + geo.getLatitude());
            },
            locationerror: function(geo, bTimeout, bPermissionDenied, bLocationUnavailable, message) {
                if(bTimeout){
                    alert('Timeout occurred.');
                } else {
                    alert('Error occurred.');
                }
            }
        }
    });
    geo.updateLocation();
}
});

如果我想创建一个文本字段而不是警告使用它更新文本字段的纬度值，该怎么办？我该怎么做？

如何使用我上面使用的结构创建文本字段？
如何从javascript调用和修改它？

提前致谢！坐在这个知识上的人很有信心！

Answer 1

恕我直言，而不是在文本字段中显示消息，消息框将更合适。如果您使用sencha的msg框，那么您也会看到漂亮的外观。所以不需要使用简单的alert。

你可以这样做..

Ext.Msg.alert('Error', 'Timeout has been occurred.', function(){
     // stuff to do when use clicks on Ok button. Can listen to location again.
});

只需将其替换为alert。

Answer 2

在构造函数中使用jQuery创建文本字段

$("#form").append('Lat: <input id="latitude" type="text" name="latitude">');

更新文字字段

$("#form").find("#latitude").val(geo.getLatitude());

就是这样:)）

Answer 3

你有结构，包括创建你想要写的东西的众多方法之一 - 但它是一个空字符串。

这样的事情应该有效：

config: {
    styleHtmlContent: true, 
    scrollabe: 'vertical',
    title: 'GPS',
    lat: '',
    tpl: '<div class="lat">New latitude: {lat}</div>'
},
constructor: function() {
    this.getPosition();
},
getPosition: function() {
    var geo = Ext.create('Ext.util.Geolocation', {
        autoUpdate: false,
        listeners: {
            locationupdate: function(geo) {
                this.lat = geo.getLatitude();
            },

模板中的类（lat）提供了一种通过CSS进行样式化的方法。

其他方法实际上取决于你想要它的显示方式 - 文本框，标题栏，浮动框，文本等。你想一直在那里，还是只想在新的输入上？

而不是“tpl”，请：

items: [{
    xtype: 'label',
    html: '',
    itemId: 'latLabel'
}]

// listener updater:
panel.down('#latLabel').setHtml('New latitude: ' + geo.getLatitude());

还有很多其他方法可以精确地创造你所追求的东西。 Sencha Touch库提供了丰富的工具，可用于创建和/或更新专门满足您需求的元素。

希望这有帮助。

Sencha Touch 2 - 添加文本字段并更新其值

3 个答案: