How to debug and fix this?

Question

In this JSFiddle

http://jsfiddle.net/littlesandra88/mzPxN/

am I trying to use the tablesorter plugin to sort the columns.

Problem

Clicking on 'N' sorts the number column just fine.

Clicking on 'Signed' also sorts the checkbox column fine, but if you un-check one of the check boxes, they are not sorted correctly any longer.

The trick seams to be to add 0 and 1 when the checkbox is clicked using this

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

and

$(document).ready(function() {

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

})

and using this as sorting algorithm

ts.addParser({
        id: 'input',
        is: function(s) {
            return s.toLowerCase().match(/<input[^>]*checkbox[^>]*/i); ;
        },
        format: function(s) {
            var integer = 0;
            if (s.toLowerCase().match(/<input[^>]*checked*/i)) {
                integer = 1;
            }
            return integer;
        },
        type: "numeric"
    });

But I am getting the error not well formed.

Have I implemented it correctly html and JQuery wise?

And if so, how do I debug and fix it?

where are you getting the error? Also did you not mean `$(this).next().html(order);`? — Stuart Burrows, Jun 15 '11 at 19:23

score 1 · Answer 1 · answered Jun 15 '11 at 19:18

1

The hidden span in your case is after so change

$(this).prev().html(order)

to

$(this).next().html(order)

Updated fiddle

answered Jun 15 '11 at 19:18

amit_g

30,880
8
61
118

score 1 · Accepted Answer · answered Jun 15 '11 at 19:18

1

you don't need to have a fancy formatter or anything:

see my edit of your fiddle:

http://jsfiddle.net/CgMZ9/

put the span before the checkboxes :)

by default, it will look at whatever text comes first in the field, which is going to be your 0 or 1, and sort on that :)

answered Jun 15 '11 at 19:18

Patricia

7,752
4
37
70

If I un-check 4991, the it still sort as if is is checked. Does this happen for you too? – Sandra Schlichting Jun 15 '11 at 19:26
right of course, that's b/c i commented out : $(this).parents("table").trigger("update"); my bad, leave that in, and it'll work a-ok – Patricia Jun 15 '11 at 19:34
@Patricia : Great! So now that the extra complexity of the sorting algorithm is needed. What does it do? – Sandra Schlichting Jun 15 '11 at 19:37
not sure what you mean, tablesorter will look at the data, see that it is a number, and sort on that :) – Patricia Jun 15 '11 at 19:43
@Patricia : I was just under the impressing that `$.tablesorter.addParser` was needed in order to sort columns with checkboxes =) Is it because `$.tablesorter.addParser` looks directly at the checkbox value, and therefore not need the `span` trick? – Sandra Schlichting Jun 15 '11 at 19:55
having the span infront makes it so you don't need the addParser :) number and text sorting is built into tableSorter. – Patricia Jun 16 '11 at 13:14

How to debug and fix this?

2 Answers2