如何对具有输入元素的列进行排序? [英] How can I sort columns having input elements?

问题描述

我有一个这样的表:

|   Update   |   Name  |  Code      | modification date |
|            |   name1 | code1      | 2009-12-09        |
|            |   name2 | otehercode | 2007-09-30        | 

更新"列包含复选框"<input type='checkbox' />".

Where the Update column contains checkboxes <input type='checkbox' />.

复选框的初始状态是在呈现表之前确定的，但是在从数据库中获取行之后才确定(它基于服务器端的条件集).

The checkbox initial state is determined before rendering the table, but after the rows are fetched from database (it's based on set of conditions, on the server-side).

默认情况下可以选中此复选框，默认情况下则不选中或禁用此复选框(disabled='disabled'作为input属性).

The checkbox can be checked by default, unchecked by default or disabled (disabled='disabled' as input attribute).

我正在使用 jQuery的Tablesorter 对我的表进行排序.我希望能够按包含复选框的列进行排序.

I'm using jQuery's Tablesorter to sort my tables. And I'd like to be able to sort by the column containing the checkboxes. How is it possible (I could pass some additional attributes to my input element maybe, if it would help...)?

我应该编写自己的解析器来处理吗?

Should I write my own parser to handle that?

推荐答案

在输入之前添加一个隐藏的范围，并在其中包含一些文本(用于对列进行排序).像这样:

Add a hidden span just before the input, and include in it some text (that will be used to sort the column). Something like:

<td>
    <span class="hidden">1</span>
    <input type="checkbox" name="x" value="y">
</td>

如果需要，您可以将事件附加到复选框，以便在选中/未选中时修改前一个同级的内容(跨度):

If needed, you can attach an event to the checkbox so that it modifies the content of the previous sibling (the span) when checked/unchecked:

$(document).ready(function() {

    $('#tableid input').click(function() {
         var order = this.checked ? '1' : '0';
         $(this).prev().html(order);
    })

})

注意:我尚未检查代码，因此它可能有错误.

Note: I haven't checked the code, so it might have errors.

这篇关于如何对具有输入元素的列进行排序?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！