0

私はJavaScriptを初めて使用するので、「」というエラーメッセージが表示される理由についてアドバイスが必要this.nodeですundefined

私が持っているのはExtJs、MVCアーキテクトを使用して構築されたアプリです。私のコントローラーでは、ツリーとグリッドを含むレイアウトを開発しました。ツリーには、[新規]ボタンをクリックして追加できる親ノードがあり、そのメソッドは完全に機能します。

ただし、レコードの挿入に使用されるのと同じフォームを使用してデータベースからレコードを更新するメソッドは、 isidを示すメッセージを生成しています。this.nodeundefined

これは私のコードですEdit handler

handleBtnEdit: function (btn, ev, eOpts) {
    console.log(this);
    var id = parseInt(this.node.get("id")), rec = this.app.getStore("ProblemRequirements").getById(id);
    this.launchForm(rec);
}, 
handleBtnAdd: function (btn, ev, eOpts) {
    var rec = Ext.create("SPOT.model.ProblemRequirement");
    this.launchForm(rec);
}, 
handleBtnSave: function (btn, eOpts) {
    var win = btn.up("window"), pnl = win.down("form"), frm = pnl.getForm(), grid = pnl.down("grid"), store = grid.getStore(), rec = frm.getRecord();
    if (frm.isValid()) {
        rec.set(frm.getValues());
        win.setLoading("Saving, please wait...");
        rec.save({
            callback : function(rec, operation) {
                if (operation.success) {
                    win.close();
                    this.getStore("ProblemRequirements").load();
                    this.playMsg("Problem requirement successfully " + (operation.action === "update" ? "updated" : "created" ) + ".");
                } else {
                    win.setLoading(false);
                    Ext.Msg.alert("Error!", operation.error[0].ERROR);
                }
            },
            scope : this
        });
    }
}, 
launchForm: function (rec) {
    Ext.create("Ext.window.Window", {
        buttons : [{
            handler : this.handleBtnSave,
            scope : this,
            text : "Save"
        }, {
            handler : this.handleBtnCancel,
            scope : this,
            text : "Cancel"
        }],
        closable : false,
        draggable : false,
        iconCls : (rec.phantom ? "icon-add" : "icon-edit"),
        items : [{
            listeners : {
                afterrender : {
                    fn : function(pnl, eOpts) {
                        pnl.getForm().loadRecord(rec);
                    },
                    scope : rec
                }
            },
            xtype : "problemrequirementForm"
        }],

        modal : true,
        resizable : false,
        title : (rec.phantom ? "Create a New" : "Edit") + " Problem Requirement",
        width : 500
    }).show();
},
4

2 に答える 2

2

このバージョンに置き換えてhandleBtnEdit、コンソールログをコピーして貼り付けます。

handleBtnEdit: function (btn, ev, eOpts) {
    console.log("-- Start of handleBtnEdit --");

    console.log(btn);
    console.log("-- 1 --");

    console.log(ev);
    console.log("-- 2 --");

    console.log(this);
    console.log("-- 3 --");

    console.log(this.getAttribute("id"));
    console.log("-- 4 --");

    console.log(this.node);
    console.log("-- 5 --");

    //var id = parseInt(this.node.get("id"));
    //var rec = this.app.getStore("ProblemRequirements").getById(id);
    //this.launchForm(rec);
}, 

また、を呼び出すコードを追加しますhandleBtnEdit

アップデート

コンソールログ:

-- Start of handleBtnEdit -- 
btn :: Object { disabled= false , iconCls= "icon-edit" , id= "btn-edit" , more...} 
-- 1 -- 
ev :: Object { browserEvent=Event click, type= "click" , button= 0 , more...} 
-- 2 -- 
this :: Object { application={...}, id= "ProblemRequirements" , hasListeners={...}, more...} 
-- 3 --

したがって、引数は。付きのボタンで渡されますid= "btn-edit"。 とthisのようです。Objectid= "ProblemRequirements"

アップデート2

内部thisにノードがなく、ノードidが必要なノードではないように思われるため、次のコードを試してください。

handleBtnEdit: function (btn, ev, eOpts) {
    var id = parseInt(btn.id);
    var rec = this.application.getStore("ProblemRequirements").getById(id);
    this.launchForm(rec);
}, 
于 2013-01-10T18:47:59.633 に答える
2

nodeは対象外です。どのスコープが定義されているかを判断して適切に参照するか、グローバルに可視にするか、ローカル ( ) スコープnodeで定義する必要があります。this

この不自然な例を考えてみましょう:

// Set global window var 'a'
window.a = 'foo';

// Create an object which has it's own scope:
var x = {
    a:'bar',

    speak:function(scope){
        console.log(scope['a']);
    }
};

次に、これを行うことができます:

// Have x report on its own scope (in function 'speak' this is the same
// as doing: console.log(this['a'])
x.speak(x);

> bar

// Set the scope to the (global) 'window' scope
x.speak(window);

> foo

xmember がないように再定義してa、同じことを試してみます。

var x = {
    speak:function(scope){
        console.log(scope['a']);
    }
};

x.speak(window);

> foo

x.speak(x);

> undefined

最後の例では、オブジェクトaのスコープ内にないため、結果は になります。ローカル ( ) スコープのみを明示的にチェックしているため、グローバル スコープではを参照できません。xundefinedathis

明らかにこれはばかげた例ですが、うまくいけば少しは役に立ちます。

乾杯

于 2013-01-10T18:42:27.883 に答える