ExtJs TabPanel 마우스 오른쪽 버튼 기능 플러그인 Ext.ux.TabCloseMenu

2097 단어 Extjs
소스:
Ext.ux.TabCloseMenu = function () {
	var tabs,
	menu,
	ctxItem;
	this.init = function (tp) {
		tabs = tp;
		tabs.on('contextmenu', onContextMenu);
	}
	function onContextMenu(ts, item, e) {
		ctxItem = item;
		if (!menu) { // create context menu on first right click
			menu = new Ext.menu.Menu([{
							id : tabs.id + '-close',
							text : '    ',
							handler : function () {
								tabs.remove(ctxItem, false);
							}
						}, {
							id : tabs.id + '-close-others',
							text : '    ',
							handler : function () {
								tabs.items.each(function (item) {
									if (item.closable && item != ctxItem) {
										tabs.remove(item, false);
									}
								});
							}
						}, {
							id : tabs.id + '-close-all',
							text : '    ',
							handler : function () {
								tabs.items.each(function (item) {
									if (item.closable) {
										tabs.remove(item, false);
									}
								});
							}
						}, '-', {
							id : tabs.id + '-closable',
							text : '   ',
							checked : true,
							hideOnClick : ctxItem.closable,
							handler : function () {
								if (item.checked) {
									ctxItem.closable = false;
								} else {
									ctxItem.closable = true;
								}
							}
						}
					]);
		}
		var items = menu.items;
		items.get(tabs.id + '-close').setDisabled(!item.closable);
		var disableOthers = true;
		tabs.items.each(function () {
			if (this != item && this.closable) {
				disableOthers = false;
				return false;
			}
		});
		items.get(tabs.id + '-close-others').setDisabled(disableOthers);
		var disableAll = true;
		tabs.items.each(function () {
			if (this.closable) {
				disableAll = false;
				return false;
			}
		});
		items.get(tabs.id + '-close-all').setDisabled(disableAll);
		menu.showAt(e.getPoint());
	}
};

Ext.preg('tabclosemenu',Ext.ux.TabCloseMenu);

사용 방법:
TabPanel에 이 문장을 더하면plugins: new Ext.ux.TabCloseMenu()
주: 원본 코드를 포함하는 js 파일을 가져와야 합니다

좋은 웹페이지 즐겨찾기