Sencha Touch 2: fireEvent from view to component (custom event)

อ้างอิงตัวอย่างจาก http://miamicoder.com/2012/how-to-create-a-sencha-touch-2-app-part-4/

จาก framework ที่ Sencha Touch 2 จัดเตรียมไว้ให้แบบ MVC ทำให้ผมเลือกใช้การ pass custom event ไปยัง controller ที่จัดเตรียมเอาไว้

ส่วนสำคัญของตัวอย่างนี้คือการ initialize  view ใน method “initialize ”  เนื่องจากครั้งแรกได้ทำนอก method เป็นแบบ config object ผลคือไม่สามารถ dispatch ไปถึงตัว listener ที่ controller ได้

View

Ext.define("NotesApp.view.NotesListContainer", {
	extend: "Ext.Container",
	alias: "widget.noteslistcontainer",

	 initialize: function () {
	  this.callParent(arguments);
	  var notesList = {
	  xtype: "noteslist",
	  store: Ext.getStore("Notes"),
	  listeners: {
	    disclose: { fn: this.onNotesListDisclose, scope: this }
	  }
         };
         this.add([notesList]);
        },
	onNotesListDisclose: function (list, record, target, index, evt, options) {
	  console.log("editNoteCommand");
          this.fireEvent('editNoteCommand', this, record);
	}
});

ในส่วนของตัวรับ สามารถกำหนด event เป็น ‘editNoteCommand’ ได้เลย

Controller

Ext.define("NotesApp.controller.Notes", {

    extend: "Ext.app.Controller",
    config: {
        refs: {
         notesListContainer: "noteslistcontainer",
	},
        control: {
            notesListContainer: {
                editNoteCommand: "onEditNoteCommand"
            },
	},
	// Commands.
    onNewNoteCommand: function () {
	console.log("onNewNoteCommand");
    }
});

Leave a Reply

Your email address will not be published. Required fields are marked *

20 − 2 =