开发者

jQuery Tablesorter don't sort columns if has class

I currently use the following to tell my table to not sort certain columns using the jquery Tablesorter plugin:

$(".uiGridContent table").tablesorter({
        sortList: [[1, 0]],
        headers: {
            0: { sorter: false },
            5: { sorter: false },
            6: { sorter: false }
        }
    });

The problem is that on my app the user can add and remove columns so therefore the order can change so my current code is not a viable solution. If I put a class on the columns I DO not want to sort e.g. <col class="nosort" /> how could I make it so it does not sort those columns?

Because I'm using <col /> I have tried the following:

$filter_ignore = $("col.nosort").closest("th").index();

    $(".uiGridContent table").tablesorter({
        sortList: [[1, 0]],
        headers: {
            $filter_ignore: {
                sorter: false
   开发者_开发百科         }
        }
    });

But doesn't work :/

I think I need some sort of loop to find all the th's with a column for them with the clase! Here is an example of my table:

<table>
 <colgroup>
  <col class="nosort" />
  <col />
 </colgroup>
  <thead>
   <tr>
    <th scope="col">a</th>
    <th scope="col">b</th>
   </tr>
  </thead>
  <tbody>
   <tr>
    <td scope="col">a</td>
    <td scope="col">b</td>
   </tr>
  </tbody>
</table>

Thanks


function setupTablesorter() {
    $('table.tablesorter').each(function (i, e) {
        var myHeaders = {}
        $(this).find('th.nosort').each(function (i, e) {
            myHeaders[$(this).index()] = { sorter: false };
        });

        $(this).tablesorter({ widgets: ['zebra'], headers: myHeaders });
    });    
}

This seems to work best!


I actually have a fork of tablesorter that allows you to add sorter-false class to the table header to prevent sorting. You can also set the parser using this method (e.g. sorter-currency, etc). Here is the demo that uses class names.


As per the documentation, you can now use class="sorter-false"


Afaik <col class="nosort" /> wont add that class to cols in its scope and I dont know how to get all colls under a colgroup or if its even possible. However if you would add class to the th, then its easy to get disable sorting on it.

var $filter_ignore = {};

$("th.nosort").each(function(i) {
    $filter_ignore[i] = {sorter: false};
});

$("table").tablesorter({
    sortList: [[1, 0]],
    headers: $filter_ignore
});

With this markup

<table>
 <colgroup>
  <col class="nosort" />
  <col />
 </colgroup>
  <thead>
   <tr>
    <th scope="col" class="nosort">a</th>
    <th scope="col">b</th>
   </tr>
  </thead>
  <tbody>
   <tr>
    <td scope="col">a</td>
    <td scope="col">b</td>
   </tr>
  </tbody>
</table>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜