Ext-Menu-日期控件过长
Code1
<%
2
/**3
* @author lzb4
* Created on 2008-12-185
* 练习使用Ext-menu6
* 7
*/8
%>9
<%@ page contentType="text/html; charset=UTF-8" %>10
<html>11
<head>12
<title>练习使用Ext-menu</title>13
<!-- Ext css -->14
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/../resources/css/ext-all.css"/>15
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/examples.css"/>16
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/menu/menus.css" />17
18
<!-- Ext js --> 19
<script type="text/javascript" src="http://www.cnblogs.com/../adapter/ext/ext-base.js"></script>20
<script type="text/javascript" src="http://www.cnblogs.com/../ext-all.js"></script>21
<script type="text/javascript" src="http://www.cnblogs.com/../source/locale/ext-lang-zh_CN.js"></script>22
<script type="text/javascript" src="http://www.cnblogs.com/examples.js"></script> 23
<script type="text/javascript">24
Ext.onReady(function(){25
//关于日期控件(DateField)在FireFox3下过长的解决办法26
//Ext.override(Ext.menu.DateMenu,{ 27
// render : function(){ 28
// Ext.menu.DateMenu.superclass.render.call(this); 29
// if(Ext.isGecko){ 30
// this.picker.el.dom.childNodes[0].style.width = '178px'; 31
// this.picker.el.dom.style.width = '178px'; 32
// } 33
// } 34
//}); 35
//或者CSS中明确设置它的宽度 36
//37
//.x-date-middle { 38
//padding-top:2px;padding-bottom:2px; 39
//width:130px; /* FF3 */ 40
//} 41
Ext.QuickTips.init();42
//必须用new43
//我在写得时候掉了一个new;大小写问题 ColorMenu,这个对象中c必须大写44
var dateMenu = new Ext.menu.DateMenu({45
handler:function(dp,date){46
Ext.example.msg('选择日期','你选择了日期{0}.',date.format('Y-m-d'));47
}48
});49
var colorMenu = new Ext.menu.ColorMenu({50
handler:function(cm,color){51
Ext.example.msg('选择颜色','你选择了颜色{0}.',color);52
}53
});54
//var menu = new Ext.menu.Menu 掉了一个new55
//checked 我把单词写错，害得checkItem方法不能显示效果56
var menu = new Ext.menu.Menu({57
id:'mainBar',58
items:[{59
text:'喜欢排骨汤',60
checkHandler:checkItem,61
checked:true62
},{63
text:'喜欢杂江面',64
checked:true,65
checkHandler:checkItem66
67
},'-',{68
text:'选择日期',69
iconCls:'calendar',70
menu:dateMenu71
},{72
text:'选择颜色',73
iconCls:'blist',74
menu:colorMenu75
}]76
});77
var toolBar = new Ext.Toolbar();78
//render和add是有先后顺序的,否则: this.tr is undefined79
toolBar.render("bar");80
toolBar.add({81
text:'主菜单',82
iconCls:'bmenu',83
menu:menu84
});85
86
function checkItem(item,checked){87
Ext.example.msg('是否选择','你{0}了{1}',checked ? 'checked' : 'unchecked',item.text);88
}89
90
});91
</script>92
</head>93
<body>94
<div id="container">95
<div id="bar"></div>96
</div>97
</body>98
</HTML>99
浙公网安备 33010602011771号