Return to Snippet

Revision: 80330
at March 5, 2020 18:43 by jlustre


Updated Code
<table width='100%' id='tblNotifications' style='display: none;' class='TFtable'><thead id='notitblhead'>
<tr>
<th id='thDate' onclick='sortNotifications(this);' title='Click to sort by Date' style='width: 100px;'>Date</th>
<th id='thType' onclick='sortNotifications(this);' title='Click to sort by Type'>Type</th>
<th id='thDoc' onclick='sortNotifications(this);' title='Click to sort by Document Type'>Doc Type</th>
<th id='thStatus' onclick='sortNotifications(this);' title='Click to sort by Status'>Status</th>
<th id='thProcess' onclick='sortNotifications(this);' title='Click to sort by Process'>Process</th>
<th style='width: 50px;'>Edit</th>
</tr>
</thead>
<tbody id='notifications'>
</tbody>
<tfoot></tfoot>
</table>

//javascript

var notinum = 1;

function sortNotifications(ele) {
	notinum *= -1;
	var sibling = prevAll(ele);
	var n = sibling.length;
	var fldtype = (ele.id == 'thDate') ? 'd' : ''; //use this line if a column is a date field where the year part is not the start of the string
	sortTableRows(notinum,n, fldtype);
}

function prevAll(element) {
    var result = [];

    while (element = element.previousElementSibling)
        result.push(element);
    return result;
}

function sortTableRows(f,n, fld=''){
	var rows = $('#tblNotifications tbody  tr').get();

	rows.sort(function(a, b) {

		var A = getVal(a, fld);
		var B = getVal(b, fld);

		if(A < B) {
			return -1*f;
		}
		if(A > B) {
			return 1*f;
		}
		return 0;
	});

	function getVal(elm,fld=''){
		var v = $(elm).children('td').eq(n).text().toUpperCase();
		if(fld !=''){
			v = getDateSortVal(v);
		}
		if($.isNumeric(v)){
			v = parseInt(v,10);
		}
		return v;
	}
	
	function getDateSortVal(str){
		var sortdate = str.split("/");
		return sortdate[2]+'/'+sortdate[0]+'/'+sortdate[1];
	}

	$.each(rows, function(index, row) {
		$('#tblNotifications').children('tbody').append(row);
	});
}

Updated Language
JavaScript

Revision: 80329
at March 5, 2020 18:38 by jlustre


Initial Title
Sort Columns from Tables

Initial Description
Use to sort table columns by clicking on the table headings

Initial Code
<table width='100%' id='tblNotifications' style='display: none;' class='TFtable'>
										<thead id='notitblhead'>
											<tr>
												<th id='thDate' onclick='sortNotifications(this);' title='Click to sort by Date' style='width: 100px;'>Date</th>
												<th id='thType' onclick='sortNotifications(this);' title='Click to sort by Type'>Type</th>
												<th id='thDoc' onclick='sortNotifications(this);' title='Click to sort by Document Type'>Doc Type</th>
												<th id='thStatus' onclick='sortNotifications(this);' title='Click to sort by Status'>Status</th>
												<th id='thProcess' onclick='sortNotifications(this);' title='Click to sort by Process'>Process</th>
												<th style='width: 50px;'>Edit</th>
											</tr>
										</thead>
										<tbody id='notifications'>
										</tbody>
										<tfoot></tfoot>
									</table>

//javascript

var notinum = 1;

function sortNotifications(ele) {
	notinum *= -1;
	var sibling = prevAll(ele);
	var n = sibling.length;
	var fldtype = (ele.id == 'thDate') ? 'd' : '';
	sortTableRows(notinum,n, fldtype);
}

function prevAll(element) {
    var result = [];

    while (element = element.previousElementSibling)
        result.push(element);
    return result;
}

function sortTableRows(f,n, fld=''){
	var rows = $('#tblNotifications tbody  tr').get();

	rows.sort(function(a, b) {

		var A = getVal(a, fld);
		var B = getVal(b, fld);

		if(A < B) {
			return -1*f;
		}
		if(A > B) {
			return 1*f;
		}
		return 0;
	});

	function getVal(elm,fld=''){
		var v = $(elm).children('td').eq(n).text().toUpperCase();
		if(fld !=''){
			v = getDateSortVal(v);
		}
		if($.isNumeric(v)){
			v = parseInt(v,10);
		}
		return v;
	}
	
	function getDateSortVal(str){
		var sortdate = str.split("/");
		return sortdate[2]+'/'+sortdate[0]+'/'+sortdate[1];
	}

	$.each(rows, function(index, row) {
		$('#tblNotifications').children('tbody').append(row);
	});
}

Initial Tags
sort, table

Initial Language
ActionScript

Initial URL