Extjs의 Extjs 도구 모음 및 메뉴 모음

</pre><pre name="code" class="javascript">Ext.onReady(function() {

			var menu = new Ext.menu.Menu();
			menu.add({
						text : 'Button 1',
						menu : [{
									text : '111'
								}, {
									text : '222'
								}, {
									text : '333'
								}]
					});
			menu.add({
						text : 'Button 2',
						menu : [{
									text : '111'
								}, {
									text : '222'
								}, {
									text : '333'
								}]
					});
			menu.add({
						text : ' ',
						menu : [new Ext.menu.CheckItem({
											text : '1 ',
											checked : true,
											group : 'single'
										}), new Ext.menu.CheckItem({
											text : '2 ',
											group : 'single'
										}), new Ext.menu.CheckItem({
											text : '3 ',
											group : 'single'
										})]
					});

			menu.add({
						text : ' ',
						menu : [new Ext.menu.CheckItem({
											text : ' ',
											checked : true
										}), new Ext.menu.CheckItem({
											text : ' '
										}), new Ext.menu.CheckItem({
											text : ' '
										})]
					});

			var btn1 = new Ext.Button({
						text : " ",
						cls : 'x-btn-text-icon',
						menu : [{
									text : " "
								}, {
									text : " "
								}, {
									text : " "
								}, {
									text : " "
								}, {
									text : " "
								}]
					});
			var btn2 = new Ext.Button({
						text : " ",
						cls : 'x-btn-text-icon',
						menu : [{
									text : " "
								}, {
									text : " "
								}, '-', {
									text : " "
								}, {
									text : " "
								}]
					});
			var btn = new Ext.Button({
                        text : " ",
                        cls : 'x-btn-text-icon',
                        menu : [{
                                    text : " ",
                                    menu : new Ext.menu.DateMenu({
                                       handler:function(dp, date){
                                           Ext.Msg.alert(' ', ' ' + date.format('Y m d '));
                                       }
                                    })
                                }, {
                                    text : " ",
                                    menu : new Ext.menu.ColorMenu()
                                }]
                    });
					
			var toolbar = new Ext.Toolbar({
						width : 300,
						height : 200,
						items : [btn1, btn2, btn],
						renderTo : Ext.getBody()
					});
			
			var showMenuBar = Ext.get("showMenuBar");
			showMenuBar.on("click", function() {
						menu.show(showMenuBar);
					});
		});

Ext.onReady(function(){
    var menu1 = new Ext.menu.Menu({
        items:[{text:' 1'},{text:' 2'},{text:' 3'}]
    });
    
    var menu2 = new Ext.menu.Menu({
        items:[{text:' 2'},{text:' 2'},{text:' 3'}]
    });
    
    var menu3 = new Ext.menu.Menu({
        items:[{text:' 1'},{text:' 2'},{text:' 3'}]
    });
    
        var menu4 = new Ext.menu.Menu({
        items:[{text:' 1'},{text:' 2'},{text:' 3'}]
    });
	
	var context= new Ext.menu.Menu({
	   items:[{text:'111',menu:menu1},{text:'222',menu:menu2},{text:'333',menu:menu3}]
	});
	
	Ext.get(document).on('contextmenu', function(e){
	   e.preventDefault(); //  
	   context.showAt(e.getXY());
	})
});