Làm cách nào để tham khảo đối tượng vùng chứa tổ tiên từ điều khiển ExtJS?

Question

Tôi đang sử dụng ExtJS để xây dựng một cửa sổ có chứa một số bảng như các mục. Một trong những bảng này có chứa một nút.

Tôi muốn đính kèm trình xử lý vào nút của mình sao cho khi tôi nhấp vào nút, tôi có thể ẩn cửa sổ chứa các bảng được đề cập ở trên và nút này.

Câu hỏi của tôi là: làm cách nào tôi có thể tham chiếu đến cửa sổ chính của nút của tôi KHÔNG tham chiếu cửa sổ theo id? Tôi thực sự muốn có một tham chiếu đến thể hiện Ext.Window và không phải là cá thể Ext.Panel có chứa nút của tôi.

Lưu ý: Tôi không muốn tham chiếu cửa sổ theo id vì tôi đang phân lớp lớp Ext.Window và do đó, id của cửa sổ sẽ không phải lúc nào cũng giống nhau. Tóm lại, tôi đang tạo một lớp Wizard, và khi tôi nhấn nút Cancel của wizard, tôi muốn ẩn cửa sổ wizard chứa nút.

Đây là mã của tôi:

var newWizardWindow = new WizardWindow({ 
    id: 'newWizardWindow', 
    title: 'New', 
    items: [ 
    ... 
    ], 
    buttons: [{ 
    text: 'Cancel', 
    handler: function() { 
     // REFERENCE WizardWindow instance here. 
    } 
    },{ 
    id: 'newWizardPreviousButton', 
    text: '« Previous', 
    disabled: true, 
    handler: newWizardNavigator.createDelegate(this, [-1]) 
    },{ 
    id: 'newWizardNextButton', 
    text: 'Next »', 
    handler: newWizardNavigator.createDelegate(this, [1]) 
    }], 
    listeners: { 
    … 
    } 
}); 

Dưới đây là một số ý tưởng tôi đã đưa ra xa như thế nào để ẩn cửa sổ:

1. this.ownerCt.ownerCt (điều này là nút). Không thuận lợi như với bản cập nhật trong tương lai cho ExtJS, số lượng cha mẹ giữa cửa sổ và nút có thể thay đổi.
2. Bằng cách nào đó lưu trữ một tham chiếu đến thể hiện WizardWindow trong lớp WizardWindow.
3. Tìm lớp WizardWindow [CSS] gần nhất trong thời trang jQuery: $ (this) .closest ('. WizardWindow'). Có thể this.findByParentType ('WizardWindow')?

Answer 1

Bạn thử phương pháp findParentByType(...) như thế nào? Tôi nhớ sử dụng nó một vài lần.

findParentByType ( Chuỗi/Ext.Component/Lớp xtype, [Boolean cạn]): Ext.Container

Tìm một container trên thành phần này tại bất kỳ cấp độ bằng cách xtype hoặc lớp học.

Ở đây bạn có thể sử dụng xtype thay vì id như tài liệu tham khảo và các xtype là như nhau không có vấn đề gì Ví dụ bạn có của loại đó.

buttons: [{ 
    text: 'Cancel', 
    handler: function() { 
     // REFERENCE WizardWindow instance here. 
     var parentWindow = this.findParentByType('xtypelizardwindow'); 
    } 
}] 

Answer 2

Trong cấu hình cho nút của bạn, với tư cách là anh chị em đối với thuộc tính trình xử lý, bạn có thể thêm phạm vi: thuộc tính newWizardWindow không? Tôi không chắc chắn 100% nếu điều đó có hiệu quả hay không, nhưng tôi nghĩ điều đó sẽ xảy ra. Điều này sẽ thiết lập phạm vi của trình xử lý nút của bạn thành cửa sổ và bên trong hàm xử lý bạn chỉ có thể thực hiện điều này.hide();

Answer 3

Bạn có thể chuyển ref dưới dạng phạm vi.

 
buttons: [{ 
    text: 'Cancel', 
    scope:this, 
    handler: function() { 
    } 
}] 

Answer 4

this.ownerCt cũng sẽ cung cấp tham chiếu đến đối tượng mẹ, là vùng chứa. vì nó đang sử dụng cái này.findParentByType (parent xtype)