الطريق إلى إنشاء قائمة مخصصة في حق الماوس فوق وظيفة حدث في ExtJS 4 هو مختلف قليلا مع ما قبل الإصدار. على ما يبدو في تحويلة 4.0.2 غيروا اسم الحدث، وترتيب الحجج.

أولا، دعونا نرى كيف نخلق القائمة في تحويلة 3. أحصل على هذا المثال من الرحمن aditia :

 فار menu1 = جديد Ext.menu.Menu ({
     البنود: [
         {
             النص: "أود تحويلة '،
             فحص: صحيح
         }، '-'، {
             النص: 'فتح ب'،
             القائمة: {
                 البنود: [{
                     النص: 'المفكرة + +'
                 }، {
                     النص: "GIMP 2.0 '
                 }، {
                     النص: 'فايرفوكس'
                 }]
             }
         }، '-'، {
             النص: 'قص'
         }، {
             النص: 'نسخة'
         }، {
             النص: "حذف"
         }، '-'، {
             النص: "تغيير الاسم"
         }
     ]
 })؛

دعونا كتابة DataView لإضافة مستمع.

 فار datav = جديد Ext.DataView ({
     autoScroll: صحيح، وتخزين: مخزن، لافوري: لافوري،
     autoHeight: كاذبة، الطول: 250، مولتيسيليكت: صحيح،
     overClass: 'X-مشاهدة المفرط "، itemSelector:" div.thumb التفاف'،
     emptyText: "لا يوجد صور للعرض،
     على غرار: "الحدود: 1px الصلبة # 99BBE8؛ '،
     المستمعين: {
         تقديم: {
             الجبهة الوطنية: وظيفة () {
                  Ext.getBody (). في ("contextmenu"، Ext.emptyFn،
                     باطل، {preventDefault: صحيح})؛
             }
         }،
         contextmenu: {
             الجبهة الوطنية: وظيفة (OBJ، مؤشر، العقدة، الحدث) {
                 س = event.browserEvent.clientX؛
                 ص = event.browserEvent.clientY؛
                 menu1.showAt ([س، ص])؛
             }
         }
     }
 })؛

عندما يتم تقديم عرض البيانات هو تعطيل حق انقر على الشبكة الافتراضية قائمة المتصفح، وهذا ما يسمى في المستمعين "تقديم" الحدث "وcontexmenu" الحدث هو للكشف عن حق الحدث الماوس فوق، والاستيلاء على موقف مؤشر الماوس وعرض القائمة.

فمن السهل أليس كذلك؟ الآن دعونا جعل حق انقر القائمة في extjs 4 MVC.

1. إضافة إلى القائمة "التطبيق / عرض / MenuRight.js 'طريقة عرض مجلد

 Ext.define ('PG.view.MenuRight'، {
         تمديد: "Ext.menu.Menu '،

	 البنود: [
		 {
			 النص: "أود تحويلة '،
			 فحص: صحيح
		 }، '-'، {
			 النص: 'فتح ب'،
			 القائمة: {
				 البنود: [{
					 النص: 'المفكرة + +'
				 }، {
					 النص: "GIMP 2.0 '
				 }، {
					 النص: 'فايرفوكس'
				 }]
			 }
		 }، '-'، {
			 النص: 'قص'
		 }، {
			 النص: 'نسخة'
		 }، {
			 النص: "حذف"
		 }، '-'، {
			 النص: "تغيير الاسم"
		 }
	 ]
 })؛

2. إضافة المستمع في ملف وحدة تحكم

 الحرف الأول: وظيفة () {
	 this.control ({
		 'alias_name_here': {
			 تقديم: وظيفة () {
				  Ext.getBody () على ("contextmenu"، Ext.emptyFn، فارغة، {preventDefault: صحيح})؛
			 }،
			 itemcontextmenu: وظيفة (شبكة، سجل، والبند، مؤشر، الحدث) {
				 س = event.browserEvent.clientX؛
				 ص = event.browserEvent.clientY؛
				 فار = القائمة الجديدة PG.view.MenuRight ()؛
				 menu.showAt ([س، ص])؛

				 / *
				 / / إذا كنت تريد إنشاء قائمة في هنا بدلا من إضافة
                                 / / القائمة في المجلد الشخصي، يمكنك استخدام التعليمات البرمجية التالية
                                 event.stopEvent ()؛
				 فار القائمة = Ext.create ('Ext.menu.Menu'، {
					 البنود: [{
						 النص: 'اسم عرض'،
						 معالج: وظيفة () {
							 تنبيه (record.get ('اسم'))؛
						 }
					 }، {
						 النص: 'معرف عرض'،
						 معالج: وظيفة () {
							 تنبيه (record.get ('user_id'))؛
						 }
					 }]
				 })؛
				 menu.showAt (event.xy)؛
				 * /

			 }
		 }،
	 })؛