ExtJs中處理時間,出現NaN-NaN-NaN的解決方式


關鍵字: extjs日期格式問題(二)

一般我們的前台代碼Ext.grid.ColumnModel里會這樣寫,以便顯示日期格式: 

Js代碼 
1.....   
2.{header:"birthday",dataIndex:"birthday".......renderer:new Ext.util.Format.dateRenderer("Y-m-d"),   
3.....  
.... 
{header:"birthday",dataIndex:"birthday".......renderer:new Ext.util.Format.dateRenderer("Y-m-d"), 
.... 
如果你前台這樣寫的話,那恭喜你,你的顯示日期那列將不再正確顯示時間,而是顯示為"NaN-NaN-NaN",是吧?呵呵,問我怎么知道的?因為最開始我也是這么錯的。 為什么會是錯的呢?讓我們來看看Ext.format.dateRenderer的源代碼(開源的東西就是好),它的源代碼是這樣的: 

Js代碼 
1.dateRenderer : function(format) {   
2.    return function(v) {   
3.        return Ext.util.Format.date(v, format);、   
4.    }   
5.}  
dateRenderer : function(format) { 
return function(v) { 
return Ext.util.Format.date(v, format);、 

} 可以看出,我們傳會來的值,被當做日期又被格式化了一次,我們傳回來的是日期嗎?以前是,經過昨天后台代碼的修改,我們傳回來的僅僅是個字符串了,至於為什么要這么改,請看昨天寫的“Extjs日期格式問題(一) ”,那咋辦?有的朋友應該已經想到了,既然是字符串,那就直接顯示唄,不用renderer了,於是前台代碼Ext.grid.ColumnModel里就變成了: 

Js代碼 
1.....   
2.{header:"birthday",dataIndex:"birthday".......),   
3.....  
.... 
{header:"birthday",dataIndex:"birthday".......), 
....可以負責任的告訴你,這樣寫,絕對可以正確顯示了,這樣是不是感覺更簡單了呢? 



但是,基於我項目里的要求,這個問題並沒有解決完,因為在這里不是一個簡單的gridpanel,而是一個editgridpanel,所以還得定義一個editor,於是有了下面這樣一段代碼: 

Js代碼 
1.....   
2.{header:"birthday",dataIndex:"birthday".......,   
3.      editor:new Ext.grid.GridEditor(new Ext.form.DateField({format:"Y-m-d"})),   
4.....  
.... 
{header:"birthday",dataIndex:"birthday"......., 
      editor:new Ext.grid.GridEditor(new Ext.form.DateField({format:"Y-m-d"})), 
....加了這個DateField控件后,每次可以正常的選擇日期,但是選擇完日期后,grid里顯示的格式就又不正確了,這次顯示的內容成了: "Wed Mar 04 1970......",這樣的格式一看就是個日期,這樣顯示的原因當然是因為我們沒有寫renderer進行格式化處理的緣故。。。 

說到這里,有人應該已經想到解決辦法了,另外有些人可能就抓狂了,這renderer加了不能正常顯示,不加也不能正常顯示,這很矛盾啊。。 

問題往往到了最矛盾的時候,也是到了解決的時候,現在我把解決代碼貼出來,大家一看就明白了。多的不說,看代碼: 

Js代碼 
1.renderer:function(value){   
2.    if(value instanceof Date){   
3.        return new Date(value).format("Y-m-d");   
4.    }else{   
5.        return value;   
6.    }   
7.}  
renderer:function(value){ 
if(value instanceof Date){ 
return new Date(value).format("Y-m-d"); 
}else{ 
return value; 

} 簡單吧?自己寫renderer就是了。。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM