Using Highlight for columns in data tables

Question

Hi, I'm using the "Highlight" function of SpryEffects in
combination with the sorting features. My HTML structure is a
simple data table, with a repeating region on the table row, so it
pulls in as many rows there are pieces in the attached XML file.
When I sort by one of the column headers at the top, I want to
highlight that whole column, so users can see what they're sorting
by. I'm able to get the first row of the data table highlighted,
but none of the following rows work. I'm pretty sure the problem is
that the highlight function only works when you use an id to define
the element that you want highlighted. If it's in a repeating row,
it sees many ids on the page, and only applies the highlight to the
first one. I want to change the id to a class, so I can put
multiple ones on the page and have it work, but I can't see how to
do that in the SpryEffects.js file.
Can anyone tell me if it's possible to do this? Thanks.
Here's the portion of the .js file:
function setupHighlight(element, effect)
Spry.Effect.setStyleProp(element, 'background-image',
'none');
function finishHighlight(element, effect)
Spry.Effect.setStyleProp(element, 'background-image',
effect.options.restoreBackgroundImage);
if (effect.direction == Spry.forwards)
Spry.Effect.setStyleProp(element, 'background-color',
effect.options.restoreColor);
Spry.Effect.Highlight = function (element, options)
var durationInMilliseconds = 1000;
var toColor = "#ffffff";
var doToggle = false;
var kindOfTransition = Spry.sinusoidalTransition;
var setupCallback = setupHighlight;
var finishCallback = finishHighlight;
var element = Spry.Effect.getElement(element);
var fromColor = Spry.Effect.getStyleProp(element,
"background-color");
var restoreColor = fromColor;
if (fromColor == "transparent") fromColor = "#ffff99";
var optionFrom = options ? options.from : '#ffff00';
var optionTo = options ? options.to : '#0000ff';
if (options)
if (options.duration != null) durationInMilliseconds =
options.duration;
if (options.from != null) fromColor = options.from;
if (options.to != null) toColor = options.to;
if (options.restoreColor) restoreColor =
options.restoreColor;
if (options.toggle != null) doToggle = options.toggle;
if (options.transition != null) kindOfTransition =
options.transition;
if (options.setup != null) setupCallback = options.setup;
if (options.finish != null) finishCallback = options.finish;
var restoreBackgroundImage =
Spry.Effect.getStyleProp(element, 'background-image');
options = {duration: durationInMilliseconds, toggle:
doToggle, transition: kindOfTransition, setup: setupCallback,
finish: finishCallback, restoreColor: restoreColor,
restoreBackgroundImage: restoreBackgroundImage, from: optionFrom,
to: optionTo};
var highlightEffect = new Spry.Effect.Color(element,
fromColor, toColor, options);
highlightEffect.name = 'Highlight';
var registeredEffect =
SpryRegistry.getRegisteredEffect(element, highlightEffect);
registeredEffect.start();
return registeredEffect;

Answer 1

Hi Philip, Thanks a lot for puting this enhancement request through.
Just downloaded the latest Patch upgrading to v 3.1.2-704 and confirmed that this functionality is not available yet.
Keeping your experience in mind what kind of expectation to you have for the approval and realization of your request?
Most likely this will take a couple of month – right? Or is there a beta version of 3.2 already available we could use.
Thanks a lot. Cheers Stefan