0

私の質問の別の1つで次の日付ソートコードを受け取ったことに感謝しています:)しかし、私は簡単な質問があります。

min-dateとmax-dateの結果をmin-dateからmax-dateの順に表示するにはどうすればよいですか？

jQuery：

$(function() {
    $.datepicker.setDefaults({ dateFormat: "dd/mm/yy" }); //sets default datepicker's dateFormat
    $("#mindate, #maxdate")
        .datepicker() //initializes both of the date inputs as jQuery UI datepickers
        .on('keypress keyup change blur', function(){ filter(); }); //sets listeners to filter the table on the fly
});

function filter(){
    $('tr').show(); //resets table to default before executing the filter
    datefields = $('table.bordered tr td:nth-child(2)'); //stores a jquery oject containing all tds of the 2nd column (dates)
    datefields.each(function(){ //iterates through them..
        var evdate = pdate($(this).html()); //evaluates each of their dates as date objects
        var mindate = pdate($('#mindate').val()); //evaluates the entered mindate (will return false if not valid*)
        if (mindate) //checks if the mindate is valid
            if (evdate < mindate)
                $(this).parent().hide(); //hides the row if its date is previous to the mindate
        var maxdate = pdate($('#maxdate').val()); //repeats same as above, now for maxdate filtering
        if (maxdate)
            if (evdate > maxdate)
                $(this).parent().hide(); //hides the row if its date is after the maxdate
    });

}

function pdate(str){ //parse date function, receives a string and returns a date if it's valid or false if it isn't
    if (!isValidDate(str))
        return false; //returns false if the date isn't valid
    var parts = str.split("/");
    // new Date(year, month [, date [, hours[, minutes[, seconds[, ms]]]]])
    return new Date(parts[2], parts[1]-1, parts[0]);
}



//this is my custom date validating function, much better than those which you may find in the web :P
function isValidDate(date)
{    
    parts = date.split('/');
    if (parts.length != 3)
        return false;
    else if (parts[0] == '' || /[^0-9]/.test(parts[0]) || parts[1] == '' || /[^0-9]/.test(parts[1]) || parts[2] == '' || /[^0-9]/.test(parts[2]))
        return false;

    day = parts[0];
    month = parts[1];
    year = parts[2];

    if (year >= 1800 && year <= 2200) //define the limits of valid dates
    {
        if (day > 0 && day <= 31 && month > 0 && month <= 12)
        {  
            if ((month == 4 || month == 6 || month == 9 || month == 11) && day > 30)
                return false;
            if (month == 2)
            {
                if (year%4 == 0 && (year%100 != 0 || year%400==0))
                {
                    if (day > 29)
                        return false; 
                }
                else if (day > 28)
                    return false;
            }
            return true;
        }
        else
            return false;
    }
    else
        return false;
}
4

2 に答える 2

1

機能する補完的な機能は次のとおりです。

function orderAsc(td){
    var evdate = pdate(td.html());
    var datefields = $('table.bordered tr td:nth-child(2)');
    datefields.each(function(i){
        var tempdate = pdate($(this).html());
        if (evdate > tempdate)
            td.parent().before($(this).parent());
    });
}

filter()次に、関数の.eachwith内から呼び出すだけorderAsc($(this))です。

ページを最初にロードするときと、新しいコンテンツをページにロードしてクライアント側の CPU 処理を節約するときにのみ、テーブルをソートすることをお勧めします。=]

于 2012-06-03T06:46:42.890 に答える
0

次に、結果を取得するためにすべての新しいロードを呼び出すことができるを使用して並べ替える必要があります

つまり、JQuery

1-この質問の回答を使用する場合jQueryテーブルソーターを使用してmm/yyの日付を並べ替えるのは便利です が、カスタマイズが必要です。

2 -jQueryを使用した要素の並べ替え

tablesorterプラグインを使用するには、HTMLドキュメントのタグ内にjQueryライブラリとtablesorterプラグインを含めます。

<script type="text/javascript" src="/path/to/jquery-latest.js"></script> 
<script type="text/javascript" src="/path/to/jquery.tablesorter.js"></script>

tablesorterは、標準のHTMLテーブルで機能します。THEADタグとTBODYタグを含める必要があります。

<table id="myTable" class="tablesorter"> 
<thead> 
<tr> 
    <th>Last Name</th> 
    <th>First Name</th> 
    <th>Email</th> 
    <th>Due</th> 
    <th>Web Site</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
    <td>Smith</td> 
    <td>John</td> 
    <td>jsmith@gmail.com</td> 
    <td>$50.00</td> 
    <td>http://www.jsmith.com</td> 
</tr> 
<tr> 
    <td>Bach</td> 
    <td>Frank</td> 
    <td>fbach@yahoo.com</td> 
    <td>$50.00</td> 
    <td>http://www.frank.com</td> 
</tr> 
<tr> 
    <td>Doe</td> 
    <td>Jason</td> 
    <td>jdoe@hotmail.com</td> 
    <td>$100.00</td> 
    <td>http://www.jdoe.com</td> 
</tr> 
<tr> 
    <td>Conway</td> 
    <td>Tim</td> 
    <td>tconway@earthlink.net</td> 
    <td>$50.00</td> 
    <td>http://www.timconway.com</td> 
</tr> 
</tbody> 
</table>

まず、ドキュメントが読み込まれたときにテーブルを並べ替えるようにtablesorterに指示します。

$(document).ready(function() 
    { 
        $("#myTable").tablesorter(); 
    } 
);

ヘッダーをクリックすると、テーブルが並べ替え可能になっていることがわかります。テーブルを初期化するときに、構成オプションを渡すこともできます。これは、テーブルソーターに1列目と2列目を昇順で並べ替えるように指示します。

$(document).ready(function() 
    { 
        $("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} ); 
    } 
);

注！tablesorterは、数値、日付、IPアドレスなど、ほとんどのデータ型を自動検出します。詳細については、例を参照してください。

于 2012-06-03T05:56:10.463 に答える