Extjs 에서 표 grid 는 날짜 형식 데 이 터 를 표시 합 니 다.

5634 단어
돌아 오 는 JSON 에는 숫자 와 문자열 이 없 지만 EXT 에 서 는 배경 에서 날짜 형식의 데 이 터 를 얻어 표 에 초기 화 할 수 있 습 니 다.
store 를 정의 하 는 render 에 한 줄 의 설정 을 추가 합 니 다. name 을 설정 하 는 것 외 에 type 과 dataFormat 두 개의 속성 도 설정 합 니 다.그 중에서 type 속성 은 reader 에 게 원본 데 이 터 를 분석 할 때 해당 하 는 열 을 날짜 형식 으로 처리 하고 dataFormat 속성 은 얻 은 문자열 을 해당 하 는 날짜 형식 으로 변환 하 는 것 을 알려 줍 니 다.EXT 의 약속 에 따 르 면 Y 는 년, m 는 월, d 는 일, H 는 시간, i 는 분, s 는 초 이다.
var store = new Ext.data.Store({
        proxy: new Ext.data.MemoryProxy(data),
        reader: new Ext.data.ArrayReader({}, [
            {name: 'id'},
            {name: 'name'},
            {name: 'descn'},
            {name: 'date', type:'date',dateFormat: 'Y-m-dTH:i:s'}
        ])
    });
cm 에 한 줄 의 설정 을 추가 하고 render 속성 을 설정 하여 날짜 형식 을 포맷 하 는 데 사용 할 데 이 터 를 설정 해 야 합 니 다. 코드 는 다음 과 같 습 니 다.
var cm = new Ext.grid.ColumnModel([
        {header: '번호', dataIndex: 'id'},
        {header: '이름', dataIndex: '이름'},
        {header: '설명', dataIndex: 'descn'},
        {header: 'date', dataIndex: 'date', render: Ext. util. Format. dateRenderer ('Y - m - d')}
    ]);
페이지 에 표 시 된 효 과 는 render 속성 에 대응 하 는 형식 입 니 다. 2.
Grid 의 cm 에서 열 을 정의 할 때 render 속성 을 사용 하여 날짜 형식 을 수정 합 니 다.. net 으로 List < T > 를 json 으로 바 꿀 때 날짜 형식 을 자주 사용 하지 않 는 형식 으로 바 꾸 기 때문에 js 를 이용 하여 변환 해 야 합 니 다.
첫 번 째 단 계 는 js 가 아 는 Date 형식 으로 변환 해 야 합 니 다: new Date (parseInt (val. substring (6, val. length - 2)))
두 번 째 단 계 는 Date 를 당신 의 요구 에 따라 바 꾸 는 것 입 니 다. 저 는 format 방법 을 확장 하 였 습 니 다.
   1:  Date.prototype.format = function(format) {
   2:      var o =
   3:                  {
   4:                      "M+": this.getMonth() + 1, //month
   5:                      "d+": this.getDate(),    //day
   6:                      "h+": this.getHours(),   //hour
   7:                      "m+": this.getMinutes(), //minute
   8:                      "s+": this.getSeconds(), //second
   9:                      "q+": Math.floor((this.getMonth() + 3) / 3), //quarter
  10:                      "S": this.getMilliseconds() //millisecond
  11:                  }
  12:   
  13:      if (/(y+)/.test(format))
  14:          format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
  15:      for (var k in o)
  16:          if (new RegExp("(" + k + ")").test(format))
  17:          format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
  18:      return format;
  19:  }

다음은 구체 적 인 Grid 날짜 열의 정의 입 니 다.
   1:  {dataIndex : 'BillDate',
   2:          header : '    ',
   3:          hidden : false,
   4:          renderer : function (val) {
   5:      return new Date(parseInt(val.substring(6, val.length - 2))).format('yyyy-MM-dd')
   6:      }
   7:      ,
   8:          sortable : false
   9:      }

좋은 웹페이지 즐겨찾기