<!-- Call this function each time -->
sortHTMLList('itemname','innerHTML','no');
//This function grabs all of the HTML elements with the same class name,
//then sorts all of those items alphabetically ascending based on sortField.
//sortField can be innerHTML or outerHTML (with fieldIsNode no) or sortField can
//also be fields from nodes within the items within the HTMLCollection (using
//fieldIsNode = 'yes')
//- This variable will hold an HTMLCollection
var someElement = {};
var someArray = [];
var i;
function sortHTMLList(sortCollection, sortField, fieldIsNode){
try {
//- Grab all HTML elements with the specified class name
someElement = document.getElementsByClassName(sortCollection);
//-Copy the document into an array, because sort functions only work on
//-arrays, not objects
someArray = [].slice.call(someElement);
//-The rest of the following is code related to sorting. this sort code
//-works well to sort a mix of letters and numbers with mixed capitalization
var reA = /[^a-zA-Z]/g;
var reN = /[^0-9]/g;
//-We have to change the way we ask for the fields if we are trying to read/
//-the value out of child node of the item in the HTMLCollection
if(fieldIsNode === 'yes')
{
someArray.sort(function(a,b) {
//-If an object yields a null value, javascript execution halts. Don't process nulls.
if((a.attributes[sortField].nodeValue !== null) && (b.attributes[sortField].nodeValue !== null))
{
var smlla = a.attributes[sortField].nodeValue.toLowerCase();
var smllb = b.attributes[sortField].nodeValue.toLowerCase();
var aA = smlla.replace(reA, "");
var bA = smllb.replace(reA, "");
if(aA === bA) {
var aN = parseInt(a.attributes[sortField].nodeValue.replace(reN, ""), 10);
var bN = parseInt(b.attributes[sortField].nodeValue.replace(reN, ""), 10);
return aN === bN ? 0 : aN > bN ? 1 : -1;
} else {
return aA > bA ? 1 : -1;
}
}
else
return 0;
});
}
//Else, we just want values off the master node of the item of the HTMLCollection
else{
someArray.sort(function(a,b) {
//-If an object yields a null value, javascript execution halts. Don't process nulls.
if((a[sortField] !== null) && (b[sortField] !== null))
{
var smlla = a[sortField].toLowerCase();
var smllb = b[sortField].toLowerCase();
var aA = smlla.replace(reA, "");
var bA = smllb.replace(reA, "");
if(aA === bA) {
var aN = parseInt(a[sortField].replace(reN, ""), 10);
var bN = parseInt(b[sortField].replace(reN, ""), 10);
return aN === bN ? 0 : aN > bN ? 1 : -1;
} else {
return aA > bA ? 1 : -1;
}
}
else
return 0;
});
}
//We assume that someArray is the same size as someElement.
//We iterate each through item and replace the someElement outerHTML
//with all the new sorted outerHTML's from someArray. The element
//is "live", so the document gets updated as the element is updated.
var mylength = someArray.length;
for (var i = 0, len = mylength; i < len; i++ ) {
//console.log("before");
//console.log(someElement[2].outerHTML);
//console.log(someArray[2].outerHTML);
console.log(someArray.length);
console.log(someElement.length);
console.log(i);
//var temp = someElement[i].outerHTML;
//someElement[i].outerHTML = 5;
someElement[i].outerHTML = someArray[i].outerHTML;
//console.log("after");
//console.log(temp);
//console.log(someElement[2].outerHTML);
//console.log(someArray[2].outerHTML);
}
}
catch(err) {
console.log("Error occured");
console.log(err);
}
};
