jQuery 테이블 orter와 함께 날짜를 정렬하는 데 문제가 있습니다

StackOverflow https://stackoverflow.com/questions/1091921

  •  11-09-2019
  •  | 
  •  

문제

Tablesorter 플러그인을 사용하여 MVC .NET 앱에서 테이블을 정렬하고 있습니다. 내 열의 대부분은 끈이고 나는 그들에게 아무런 문제가 없습니다. 숫자도 없습니다. 문제는 내 dateTime 열이 마치 줄 인 것처럼 정렬되고 있다는 것입니다. 그들은 다음과 같이 분류됩니다 : 01/04/2009, 02/02/2009, 03/08/2009 등. 해당보기의 모델에서 데이터를 얻습니다.

내 전화는 기본 전화입니다. 

$("#table").tablesorter();

운이없는 날짜 format을 지정하려고 시도했습니다.

$("#table").tablesorter({
            dateFormat: 'dd/mm/yyyy'});

홀수 일은 임의의 날짜가있는 정적 테이블을 수동으로 입력 할 때 발생합니다. 분류됩니다! 그러나 내 데이터는 DB 호출에서 나오고 모델에 넣은 다음 ITREATE를 통해 데이터를 작성합니다.

미리 감사드립니다.

편집 : TR을 만드는 방식과 관련이있을 수 있습니까?

<% foreach (var item in Model) { %>
<tr>
<td>
<%= Html.Encode(item.date) %>
</td>
<td>...</td>
<td>...</td>
<td>...</td>
</tr>
<% } %>
도움이 되었습니까?

해결책

날짜 열에 테이블 포터 파서를 추가 해보십시오. Tablesterter는 Shortdate, Uslongdate 및 Isodate의 구문 분석기와 함께 제공됩니다.

$("#table").tablesorter({
    headers: { colNum: { sorter: 'shortDate'} }
});

여기서 Colnum은 날짜가있는 열입니다. 테이블 orter 사이트에서 찾을 수있는 유일한 예는 여기. 테이블 orter가 숫자를 잘못 정렬하는 경우에도 작동합니다. 퍼센트, IP 주소 등에 대한 다른 파서도 있습니다. 소스 코드의 끝 근처에서 살펴 보면 그곳에 나열됩니다.

편집하다:소스 코드를 살펴보면 DateFormat 옵션은 "US", "UK", "DD/MM/YY"또는 "DD-MM-YY"만 찾고있는 것으로 보입니다. "UK"를 시도하면 어떻게됩니까?

다른 팁

같은 문제가 생겼고 DateTime이라는 커스텀 파서를 추가했습니다.

$.tablesorter.addParser({
    id: "datetime",
    is: function(s) {
        return false; 
    },
    format: function(s,table) {
        s = s.replace(/\-/g,"/");
        s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1");
        return $.tablesorter.formatFloat(new Date(s).getTime());
    },
    type: "numeric"
});

그런 다음 Gabe G가 노출 된 것처럼 해당 형식을 원하는 열에 적용하면됩니다 (예 :이 분류기를 첫 번째 열에 할당하려면 다음을 수행해야합니다.

$("#mytable").tablesorter( 
    {   dateFormat: 'dd/mm/yyyy', 
        headers: 
            {
                0:{sorter:'datetime'}
            } 
    } );

날짜 전에 숫자 형식 (yyyymmdd)으로 숨겨진 스팬 태그를 추가 할 수도 있습니다. 이 텍스트는 먼저 나오고 정렬에 사용되지만 시야에서 숨겨져 있고 원하는 형식 만 표시합니다.

    <td><span style="display:none">20130923</span>23 September 2013</td>

jQuery Tablesterter 플러그인에 대한 업데이트가 있습니다.

응용 프로그램의 로케일에 따르면이 업데이트로 날짜를 정렬 할 수 있습니다.

아래 링크를 따라 테이블 어의 업데이트를 볼 수 있습니다.

http://tablester.openwerk.de/

더 쉬운 방법 사용 : 

dateFormat:'mm/dd/yyyy hh:mm:ss'

솔직히 말해서, Compsmart가 말했듯이 나에게 가장 간단한 솔루션은 실제 날짜 앞에 숨겨진 텍스트를 추가하는 것이 었습니다.

  • DateFormat : 'UK' 내 날짜 형식이 다시 다르기 때문에 나를 위해 일하지 않았을 것입니다.
  • http://tablester.openwerk.de/ CSS 수정과 관련이 있습니다. 먼저 왜 그 이유를 이해하지 못하고 두 번째로 노력이 날짜 앞에 숨겨진 텍스트를 추가하는 것보다 더 큽니다.

나는 Compsmart의 Kiss Solution을 좋아합니다!

http://mottie.github.io/tablester/docs/

날짜 형식을 설정하십시오. 사용 가능한 옵션은 다음과 같습니다. (수정 된 v2.0.23).

  • "mmddyyyy"(기본값)
  • "ddmmyyyy"
  • "yyyymmdd"

이전 버전 에서이 옵션은 "US", "UK"또는 "DD/MM/YY"로 설정되었습니다. 이 옵션은 필요한 날짜 형식에 더 잘 맞도록 수정되었습니다. 그것은 4 자리 연도에서만 작동합니다!

분류기는 "ShortDate"로 설정되어야하며 날짜 형식은 "DateFormat"옵션으로 설정하거나 "헤더"옵션 내의 특정 열에 대해 설정할 수 있습니다. 데모 페이지를 참조하여 작동하는 것을 볼 수 있습니다.

$(function(){
  $("table").tablesorter({

    dateFormat : "mmddyyyy", // default date format

    // or to change the format for specific columns,
    // add the dateFormat to the headers option:
    headers: {
      0: { sorter: "shortDate" }, // "shortDate" with the default dateFormat above
      1: { sorter: "shortDate", dateFormat: "ddmmyyyy" }, // day first format
      2: { sorter: "shortDate", dateFormat: "yyyymmdd" }  // year first format
    }

  });
});

우선 순위 (수정 된 v2.3.1)로 설정된 다음을 추가하여 개별 열을 수정할 수 있습니다 (모두 동일한 작업을 수행합니다).

  • jQuery data data-dateformat = "mmddyyyy".
  • 메타 데이터 클래스 = "{dateformat : 'mmddyyyy'}". 메타 데이터 플러그인이 필요합니다.
  • 헤더 옵션 헤더 : {0 : {dateformat : 'mmddyyyy'}}.
  • 헤더 클래스 이름 클래스 = "dateformat-mmddyyyy". 전체 날짜 형식 옵션.

제 경우에는 사용했습니다 

$("#myTable").tablesorter({dateFormat: "uk"})

버전의 경우.

이것이 저에게 답이었습니다.

<td data-order=<fmt:formatDate pattern = "yyyy-MM-dd" value = "${myObject.myDate}" />>${myObject.myDate}</td>

자세한 내용은 다음과 같습니다. https://datatables.net/manual/data/

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top