4

jQueryテーブルソータープラグインを使用していますが、数千のコンマ区切り文字を使用してテーブルを読みやすくしたいと思います。つまり、number_format（$ value、0、 ""、 "、"）;

ただし、これにより並べ替えが中断されます。私は解決策を探していましたが（例： http： //lab.christianmontoya.com/jquery-tablesort-numbers-commas/）、それを調整してテーブルに対応することができませんでした。私はスクリプトを初めて使用するので、気を付けてください。

私のjavascriptブロックはどのように見えるべきですか？

<head>
<script type="text/javascript">
    $(document).ready(function() { 
        $("#myTable").tablesorter( {
            sortList: [[1,1], [2,1]],
            widgets: ['zebra'],
        } );
    }); 
</script>
</head>


<body>
<table id="myTable" class="tablesorter"> 
<thead> 
<tr> 
<th>Username</th> 
<th>Level</th> 
<th>Experience</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td>Fiery</td> 
<td><?php echo number_format(2400, 0, " ", ","); ?></td> 
<td><?php echo number_format(378433689, 0, " ", ",");?></td> 
</tr> 
<tr> 
<td>Sixten</td> 
<td><?php echo number_format(1600, 0, " ", ","); ?></td> 
<td><?php echo number_format(1000000000, 0, " ", ",");?></td> 
</tr> 
<tr>                    
<td>Penny</td> 
<td><?php echo number_format(885, 0, " ", ","); ?></td> 
<td><?php echo number_format(8900002, 0, " ", ","); ?></td> 
</tr> 
<tr>
<td>Petra</td> 
<td><?php echo number_format(2400, 0, " ", ","); ?></td> 
<td><?php echo number_format(398433889, 0, " ", ","); ?></td> 
</tr> 
<tr>
<td>Neu</td> 
<td><?php echo number_format(4974, 0, " ", ","); ?></td> 
<td><?php echo number_format(198433889, 0, " ", ","); ?></td> 
</tr> 
</tbody> 
</table>
</body>
4

1 に答える 1

6

必要なヘッダー/列にカスタムフォーマットを適用する必要があります。

マークアップ：

<table id="myTable" class="tablesorter" border="0" cellpadding="0" cellspacing="1">
        <thead>
            <tr>
                <th>
                    Price
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    1,000.00
                </td>
            </tr>
            <tr>
                <td>
                    100,100.00
                </td>
            </tr>
            <tr>
                <td>
                    100,980.00
                </td>
            </tr>
            <tr>
                <td>
                    100,122.00
                </td>
            </tr>
            <tr>
                <td>
                    120,122.00
                </td>
            </tr>
            <tr>
                <td>
                    540,122.00
                </td>
            </tr>
            <tr>
                <td>
                    222,122.00
                </td>
            </tr>
            <tr>
                <td>
                    100,020.00
                </td>
            </tr>
            <tr>
                <td>
                    100,251.00
                </td>
            </tr>
            <tr>
                <td>
                    100,364.00
                </td>
            </tr>
            <tr>
                <td>
                    300,122.00
                </td>
            </tr>
        </tbody>
    </table>

jQuery：

    $(document).ready(function () {
        jQuery.tablesorter.addParser({
            id: "fancyNumber",
            is: function (s) {
                return /^[0-9]?[0-9,\.]*$/.test(s);
            },
            format: function (s) {
                return jQuery.tablesorter.formatFloat(s.replace(/,/g, ''));
            },
            type: "numeric"
        });

        $("#myTable").tablesorter({
            headers: { 0: { sorter: 'fancyNumber'} },
            widgets: ['zebra']
        });
    });

JSFiddle： http: //jsfiddle.net/eAgDC/

于 2013-02-19T19:49:16.967 に答える