-Fix for sorting the tables and taking into account the fact that the first column is not sort-able when it contains checkboxes.

-Also adds icons (up/down arrows to indicate the current sort order).
- Last but not least fixes a number of problems when adding/removing linked objects the lists were not sorting or hilighting properly.

SVN:trunk[828]
This commit is contained in:
Denis Flaven
2010-09-12 21:06:09 +00:00
parent e3edf855eb
commit 5d97891616
9 changed files with 104 additions and 24 deletions

View File

@@ -270,7 +270,23 @@ class DisplayBlock
$("#'.$sId.'").empty();
$("#'.$sId.'").append(data);
$("#'.$sId.'").removeClass("loading");
$("#'.$sId.' .listResults").tablesorter( { headers: { 0:{sorter: false }}, widgets: [\'zebra\']} ); // sortable and zebra tables
// Check each "listResults" table for a checkbox in the first column and make the first column sortable only if it does not contain a checkbox in the header
$("#'.$sId.'".listResults").each( function()
{
var table = $(this);
var id = $(this).parent();
var checkbox = (table.find(\'th:first :checkbox\').length > 0);
if (checkbox)
{
// There is a checkbox in the first column, do not make it sortable
table.tablesorter( { headers: { 0: {sorter: false}}, widgets: [\'myZebra\', \'truncatedList\']} ); // sortable and zebra tables
}
else
{
// There is NO checkbox in the first column, all columns are considered sortable
table.tablesorter( { widgets: [\'myZebra\', \'truncatedList\']} ); // sortable and zebra tables
}
});
}
);
</script>';

View File

@@ -162,6 +162,11 @@ class iTopWebPage extends NiceWebPage
$("tbody tr.red:even",table).removeClass('red').removeClass('even').addClass('red_even');
$("tbody tr.orange:even",table).removeClass('orange').removeClass('even').addClass('orange_even');
$("tbody tr.green:even",table).removeClass('green').removeClass('even').addClass('green_even');
// In case we sort again the table, we need to remove the added 'even' classes on odd rows
$("tbody tr:odd",table).removeClass('even');
$("tbody tr.red_even:odd",table).removeClass('even').removeClass('red_even').addClass('red');
$("tbody tr.orange_even:odd",table).removeClass('even').removeClass('orange_even').addClass('orange');
$("tbody tr.green_even:odd",table).removeClass('even').removeClass('green_even').addClass('green');
}
});
@@ -231,7 +236,23 @@ class iTopWebPage extends NiceWebPage
// End of Tabs handling
$("table.listResults").tableHover(); // hover tables
$(".listResults").tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
// Check each 'listResults' table for a checkbox in the first column and make the first column sortable only if it does not contain a checkbox in the header
$(".listResults").each( function()
{
var table = $(this);
var id = $(this).parent();
var checkbox = (table.find('th:first :checkbox').length > 0);
if (checkbox)
{
// There is a checkbox in the first column, don't make it sortable
table.tablesorter( { headers: { 0: {sorter: false}}, widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
}
else
{
// There is NO checkbox in the first column, all columns are considered sortable
table.tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
}
});
$(".date-pick").datepicker({
showOn: 'button',
buttonImage: '../images/calendar.png',

View File

@@ -179,7 +179,7 @@ class UILinksWizard
function(data)
{
$('#SearchResultsToAdd').html(data);
$('#SearchResultsToAdd .listResults').tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
$('#SearchResultsToAdd .listResults').tablesorter( { headers: {0: false}}, widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
},
'html'
@@ -233,7 +233,7 @@ class UILinksWizard
}
$('.listResults tbody').append(data);
$('.listResults').trigger('update');
$('.listResults').tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
$('.listResults').tablesorter( { headers: {0: false}}, widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
},
'html'
);

View File

@@ -66,31 +66,31 @@ tr.containerHeader, tr.containerHeader td {
background: transparent;
}
tr.even td {
tr.even td, .wizContainer tr.even td {
background-color: #f9f9f1;
}
tr.red_even td {
tr.red_even td, .wizContainer tr.red_even td {
background-color: #f97e75;
color: #ffffff;
}
tr.red td {
tr.red td, .wizContainer tr.red td {
background-color: #f9a397;
color: #ffffff;
}
tr.orange_even td {
tr.orange_even td, .wizContainer tr.orange_even td {
background-color: #f4d07a;
}
tr.orange td {
tr.orange td, .wizContainer tr.orange td {
background-color: #f4e96c;
}
tr.green_even td {
tr.green_even td, .wizContainer tr.green_even td {
background-color: #bee5a3;
}
tr.green td {
tr.green td, .wizContainer tr.green td {
background-color: #b3e5b4;
}
tr td.hover, tr.even td.hover, .hover a, .hover a:visited, .hover a:hover {
tr td.hover, tr.even td.hover, .hover a, .hover a:visited, .hover a:hover, .wizContainer tr.even td.hover, .wizContainer tr td.hover {
background-color: #fdf5d0;
color: #000000;
}
@@ -105,10 +105,21 @@ th {
th.header {
cursor: pointer;
background-repeat: no-repeat;
background-position: center right;
background-image: url(../images/bg.gif);
background-repeat: no-repeat;
padding-right: 16px; // some space for the asc/desc icons
}
th.headerSortUp, th.headerSortDown {
th.headerSortUp {
background-image: url(../images/asc.gif);
text-decoration: underline;
cursor: pointer;
}
th.headerSortDown {
background-image: url(../images/desc.gif);
text-decoration: underline;
cursor: pointer;
}
@@ -635,22 +646,22 @@ div.HRDrawer {
}
/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
table.listResults tr.odd td.truncated, table.listResults tr td.truncated {
table.listResults tr.odd td.truncated, table.listResults tr td.truncated, .wizContainer table.listResults tr.odd td.truncated, .wizContainer table.listResults tr td.truncated {
background: url(../images/truncated.png) bottom repeat-x;
}
/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
table.listResults tr.even td.truncated {
table.listResults tr.even td.truncated, .wizContainer table.listResults tr.even td.truncated {
background: #f9f9f1 url(../images/truncated.png) bottom repeat-x;
}
/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
table.listResults tr.even td.hover.truncated {
table.listResults tr.even td.hover.truncated, , .wizContainer table.listResults tr.even td.hover.truncated {
background: #fdf5d0 url(../images/truncated.png) bottom repeat-x;
}
/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
table.listResults tr.odd td.hover.truncated, table.listResults tr td.hover.truncated{
table.listResults tr.odd td.hover.truncated, table.listResults tr td.hover.truncated, .wizContainer table.listResults tr.odd td.hover.truncated, .wizContainer table.listResults tr td.hover.truncated {
background: #fdf5d0 url(../images/truncated.png) bottom repeat-x;
}

BIN
images/asc.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 B

BIN
images/bg.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 B

BIN
images/desc.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 B

View File

@@ -36,8 +36,8 @@ function LinksWidget(id, sClass, sAttCode, iInputId, sSuffix)
);
// Disable the button since all the selected items have been removed
$(my_id+'_btnRemove').attr('disabled','disabled');
// Re-run the zebra plugin to properly highlight the remaining lines
$('#linkset_'+this.id+' .listResults').trigger('update');
// Re-run the zebra plugin to properly highlight the remaining lines & and take into account the removed ones
$('#linkedset_'+this.id+' .listResults').trigger('update').trigger("applyWidgets");
}
@@ -97,7 +97,8 @@ function LinksWidget(id, sClass, sAttCode, iInputId, sSuffix)
function(data)
{
$(sSearchAreaId).html(data);
$(sSearchAreaId+' .listResults').tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
$(sSearchAreaId+' .listResults').tableHover();
$(sSearchAreaId+' .listResults').tablesorter( { headers: {0: {sorter: false}}, widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
},
'html'
@@ -151,7 +152,8 @@ function LinksWidget(id, sClass, sAttCode, iInputId, sSuffix)
$('#'+me.id+'_empty_row').remove();
$('#linkedset_'+me.id+' .listResults tbody').append(data);
$('#linkedset_'+me.id+' .listResults').trigger('update');
$('#linkedset_'+me.id+' .listResults').tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
$('#linkedset_'+me.id+' .listResults').tableHover();
$('#linkedset_'+me.id+' .listResults').trigger('update').trigger("applyWidgets"); // table is already sortable, just refresh it
$('#linkedset_'+me.id+' :input').each( function() { $(this).trigger('validate', ''); }); // Validate newly added form fields...
}
},

View File

@@ -13,7 +13,22 @@ function ReloadTruncatedList(divId, sSerializedFilter, sExtraParams)
$('#'+divId).append(data);
$('#'+divId).removeClass('loading');
$('#'+divId+' .listResults').tableHover(); // hover tables
$('#'+divId+' .listResults').tablesorter( { widgets: ['zebra', 'truncatedList']} ); // sortable and zebra tables
$('#'+divId+' .listResults').each( function()
{
var table = $(this);
var id = $(this).parent();
var checkbox = (table.find('th:first :checkbox').length > 0);
if (checkbox)
{
// There is a checkbox in the first column, don't make it sortable
table.tablesorter( { headers: { 0: {sorter: false}}, widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
}
else
{
// There is NO checkbox in the first column, all columns are considered sortable
table.tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
}
});
//$('#'+divId).unblockUI();
}
);
@@ -47,7 +62,22 @@ function ReloadBlock(divId, sStyle, sSerializedFilter, sExtraParams)
$('#'+divId).append(data);
$('#'+divId).removeClass('loading');
$('#'+divId+' .listResults').tableHover(); // hover tables
$('#'+divId+' .listResults').tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
$('#'+divId+' .listResults').each( function()
{
var table = $(this);
var id = $(this).parent();
var checkbox = (table.find('th:first :checkbox').length > 0);
if (checkbox)
{
// There is a checkbox in the first column, don't make it sortable
table.tablesorter( { headers: { 0: {sorter: false}}, widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
}
else
{
// There is NO checkbox in the first column, all columns are considered sortable
table.tablesorter( { widgets: ['myZebra', 'truncatedList']} ); // sortable and zebra tables
}
});
//$('#'+divId).unblockUI();
}
);