Make overview table sortable

[atelesca]

Hello,
I am using Zabbix in a large environment where I need to display data from groups containing more than 100 hosts.
I need to make the overview tables sortable in order to spot the hosts with the lowest/highest values and ease the administration.

As I didn't find a way to achieve this without changing the Zabbix files I changed the files like this.
- I added jquery.tablesorter.js and customScript.js to jsLoader.php in the Zabbix files (/usr/share/zabbix)
- the customScript.js is

(function($) {
$(document).ready(function(){
$('.tableinfo tr.vertical_header td').replaceWith(function(){
return $('<th/>').html($(this).html()).attr('class', $(this).attr('class'));
});
$('.tableinfo tr.vertical_header').wrapAll('<thead>');
$('.tableinfo thead').appendTo('.tableinfo');
$(".tableinfo").tablesorter();
});
})(jQuery);

it replaces tr,vertical_header td with th and wraps everything in thead tag.

In addition, I added to following lines to the default.css file in styles:

table.tableinfo tr.vertical_header th { padding: 5px 0 5px 5px; margin: 0; white-space: nowrap; word-spacing: 0; font-weight: bold; width: 20px; text-align: center; background-color: #ddd; }
table.tableinfo tr.vertical_header th:hover {
cursor: pointer;
background-color: #ccc !important;
}
table.tableinfo tr.vertical_header th.left { text-align: left; }
table.tableinfo tr.vertical_header th.vertical_rotation { white-space: nowrap; align: center; font-family:arial; font-size:11px; }
table.tableinfo tr.vertical_header th.vertical_rotation .vertical_rotation_inner {
transform: rotate(270deg); -moz-transform: rotate(270deg); -webkit-transform: rotate(270deg); -o-transform: rotate(270deg);
white-space: nowrap;
}

This would do the job and maybe other people can benefit from it.
However, please let me know if there is another way to do so without modifying Zabbix files.
Best regards,
Adriana