0

ExtJsのJSon応答からチェックボックスグループにデータを入力するのが好きです。[送信]ボタンをクリックすると、コンソールに応答が表示されます。

Ext.define('myclass', {
extend: 'Ext.form.Panel',
initComponent: function(){
Ext.apply(this, {
renderTo: Ext.getBody(),
title: 'Message',
tbar: [{
    text: 'Send',
    handler: function(){
    console.log(this.getValues());
    },
    scope: this
}],
items: []
});
    this.callParent(arguments);
}
});
    var messagePanel = new myclass();

loadCheckboxes : function(){
Ext.Ajax.request({
    url: 'recipients.json',
    success: function(response){
        console.log(response);
    },
    scope: this
    });
}

this.loadCheckboxes();

onLoad : function(response){
var jsonResponse = Ext.decode(response.responseText);
    if (jsonResponse.success) {
    // success
    console.log(jsonResponse);
    }
}

    Ext.Ajax.request({
    url: 'recipients.json',
    success: onLoad(),
    scope: this
    });

var checkboxGroup = {
xtype: 'checkboxgroup',
columns: 2,
fieldLabel: 'Recipients',
name: 'recipients',
style: {
padding: '10px'
},
items: []
};
this.add(checkboxGroup);

var i, len = jsonResponse.recipients.length, recipient;
for (i = 0; i < len; i++) {
recipient = jsonResponse.recipients[i];
    checkboxGroup.items.push({
    xtype: 'checkbox',
    boxLabel: recipient.fullName,
    name: 'recipients',
    inputValue: recipient.userID,
    checked: recipient.selected
    });
}

これがこのコードのJsonコードです。

{
"success": true,
"recipients": [{
"fullName": "Stuart Ashworth",
"userID": 1,
"selected": true
}, {
"fullName": "Andrew Duncan",
"userID": 2,
"selected": false
}
]
}

このコードを実行すると、コンソールにエラーが表示されます。 SyntaxError:関数ステートメントには名前loadCheckboxesが必要です:function(){

この問題の解決策を教えてください。

4

2 に答える 2

3

オブジェクトのキー値を定義しようとしているようです。

loadCheckboxes : function(){
    // ...
}

ただし、これらは宣言された変数または関数として使用する必要があります。

var loadCheckboxes = function () {
    // ...
};

function loadCheckboxes() {
    // ...
}

それらはオブジェクトリテラル{...}内にないため---構文は関数式name: value設定されたオブジェクトのキーを定義します。これは匿名にすることができます。

代わりに、それらはラベルの後に関数宣言が続き、匿名にすることはできません。

于 2013-02-06T06:15:07.710 に答える
0

これがどのように機能するかを確認してください

Ext.define('myclass', {
    extend: 'Ext.form.Panel',
    initComponent: function() {
        Ext.apply(this, {
            renderTo: Ext.getBody(),
            title: 'Message',
            tbar: [
                {
                    text: 'Send',
                    handler: function() {
                        console.log(this.getValues());
                    },
                    scope: this
                }
            ],
            items: [
                {
                    xtype: 'checkboxgroup',
                    columns: 2,
                    fieldLabel: 'Recipients',
                    name: 'recipients',
                    style: {
                        padding: '10px'
                    },
                    items: []
                }
            ]
        });
        this.callParent(arguments);
    },
    onLoad: function(response) {
        var jsonResponse = Ext.decode(response.responseText);
        if (jsonResponse.success) {
            // success
            console.log(jsonResponse);
            var i, len = jsonResponse.recipients.length, recipient;
            var checkboxGroup = this.down('checkboxgroup[name="recipients"]');
            for (i = 0; i < len; i++) {
                recipient = jsonResponse.recipients[i];
                checkboxGroup.add({
                    xtype: 'checkbox',
                    boxLabel: recipient.fullName,
                    name: 'recipients',
                    inputValue: recipient.userID,
                    checked: recipient.selected
                });
            }
        }
    }
});

var messagePanel = new myclass();

function loadCheckboxes() {
    Ext.Ajax.request({
        url: 'recipients.json',
        success: function(response){
            console.log(response);
        }
        // , scope: this <-- you don't need scope here, you are not in a class
    });
}

loadCheckboxes(); // <-- I assume this call and the next are for debugging pourposes

Ext.Ajax.request({
    url: 'recipients.json',
    success: messagePanel.onLoad,
    scope: messagePanel
});
于 2013-02-06T14:27:02.640 に答える