Tablesorter plugin not sorting input data

I have built numerous table that all work perfectly except when i have data that is editable by user ( using input type=“text” i am unable to use tablesorter to sort the columns that are editable. i have called table sorter
$("#GuideMain").tablesorter({
theme: ‘blue’,

 widgets: ['resizable', 'stickyHeaders'],
widgetOptions : {
  // css class name applied to the sticky header
  resizable : true,

}
			
						});

then i use ajax to fill the table and the table displays correctly but i am only able to sort by the first column that is not editable.
$("#ViewList").click(function() {
$(’#loading’).show();
$("#GuideMain tbody tr").remove();

		$.ajax({
		type: "POST",
		url: "ViewGMData.php",
		dataType: "json"
		
		success: function(data){
			if (data.message) {
				alert ("You Must Pick a Filter");
				 $('#loading').hide();
			}
			else{
			if(data.ID==null){
			$("#GuideMain").append('<tr><td>No Records Found</td></tr>');
			  $('#loading').hide();
		}else{
			//append general data
			for(var x=0;x<data.ID.length;x++)
			{

$("#GuideMain").append(’’+data.ID[x]+
‘<input type=“text12” id=“tableISBN” value="’+data.ISBN[x]+
');

$(’#loading’).hide();
}
}
$("#GuideMain").trigger(“update”);
}
}
});

to fix this i had to add this code

     $.tablesorter.addParser({
id: 'inputs',
is: function(s) {
    return false;
},
format: function(s, table, cell, cellIndex) {
    var $c = $(cell);
    if (!$c.hasClass('updateInput')) {
        $c
        .addClass('updateInput')
        .bind('keyup', function() {
            $(table).trigger('updateCell', [cell, false]); // false to prevent resort
        });
    }
    return $c.find('input').val();
},
type: 'text'});

and then make sure it is done for each type of input, textarea,checkbox

Sponsor our Newsletter | Privacy Policy | Terms of Service