天天看點

FireFox中使用ExtJs日期控件錯誤的解決方法

在extjs中有一個字段是日期格式,我想直接使用extjs控件,這樣可以選擇日期。字段屬性如下

{  

                            xtype : 'datefield',// 日期框  

                            width : 220,  

                            format : 'Y-m-d',  

                            allowBlank : false,  

                            invalidText : '您輸入的日期無效,必須符合格式yyyy-mm-dd',  

                            name : 'orderDate',  

                            fieldLabel : '訂單建立時間',  

                            renderer : Ext.util.Format.dateRenderer('Y-m-d'),  

                            value : new Date()  

                        }  

但是這個日期控件在FireFox下顯示錯誤,在谷歌浏覽器下顯示正确。

下面将解決方法:

 将下面兩個js檔案加入到項目webcontent/main/目錄下,然後

在主jsp重,我的是main.jsp下加入這兩個js檔案的連結。

date1.js

Ext.override(Ext.menu.Menu, {  

    autoWidth : function() {  

        var el = this.el, ul = this.ul;  

        if (!el) {  

            return;  

        }  

        var w = this.width;  

        if (w) {  

            el.setWidth(w);  

        } else if (Ext.isIE && !Ext.isIE6) {  

            el.setWidth(this.minWidth);  

            var t = el.dom.offsetWidth;  

            el.setWidth(ul.getWidth() + el.getFrameWidth("lr"));  

    }  

});  

date.js

Ext.override(Ext.menu.DateMenu, {  

    render : function() {  

        Ext.menu.DateMenu.superclass.render.call(this);  

        if (Ext.isGecko) {  

            this.picker.el.dom.childNodes[0].style.width = '178px';  

            this.picker.el.dom.style.width = '178px';  

main.jsp

...  

        <link rel="stylesheet" type="text/css" href="ExtJS/resources/css/ext-all.css" mce_href="ExtJS/resources/css/ext-all.css" />  

        <link rel="stylesheet" type="text/css" href="ExtJS/css/style.css" mce_href="ExtJS/css/style.css" />  

        <mce:script type="text/javascript" src="ExtJS/adapter/ext/ext-base.js" mce_src="ExtJS/adapter/ext/ext-base.js"></mce:script>  

        <mce:script type="text/javascript" src="ExtJS/ext-all.js" mce_src="ExtJS/ext-all.js"></mce:script>  

        <mce:script type="text/javascript" src="ExtJS/source/locale/ext-lang-zh_CN.js" mce_src="ExtJS/source/locale/ext-lang-zh_CN.js"></mce:script>  

        <mce:script type="text/javascript" src="ExtJS/themeChange.js" mce_src="ExtJS/themeChange.js"></mce:script>  

        <mce:script type="text/javascript" src="ExtJS/examples/ux/SearchField.js" mce_src="ExtJS/examples/ux/SearchField.js"></mce:script>  

        <mce:script type="text/javascript" src="main/main.js" mce_src="main/main.js"></mce:script>  

        <mce:script type="text/javascript" src="main/date.js" mce_src="main/date.js"></mce:script>  

        <mce:script type="text/javascript" src="main/date1.js" mce_src="main/date1.js"></mce:script>  

本文轉自xwdreamer部落格園部落格,原文連結:http://www.cnblogs.com/xwdreamer/archive/2010/12/02/2297064.html,如需轉載請自行聯系原作者