// Add hover and click behavior for parent cells of punch inputs (radio and checkboxes)
// On parent cell hover, highlight the parent cell by applying 'hovered-cell' class
// On parent cell click, click the child punch input and highlight the parent cell by applying 'selected-cell' class
$(function () {
var $punchInputs = $('input[type="radio"], input[type="checkbox"]');
var $punchInputParentCells = $punchInputs.closest('[class*="_ROW"]');
// Display Mode 1 multi-column input elements do not have a unique parent. Wrap these input elements and their
// sibling text/other specify cells in a unique parent element.
var $ambiguousPunchInputParentCells = $punchInputParentCells.filter(function () {
return $(this).attr('class').indexOf('BS_FLOW_ROW_') !== -1;
});
$ambiguousPunchInputParentCells.each(function () {
var $childCells = $(this).children('td');
var childGroups = [];
$childCells.each(function () {
// Each group of cells associated with an input element begins with a cell with class 'BS_GRID_NORMAL'
if ($(this).attr('class') === 'BS_GRID_NORMAL') {
childGroups.push($(this));
// Override BS_GRID_NORMAL's CSS background color
$(this).css({ 'backgroundColor': 'transparent' });
} else {
childGroups[childGroups.length - 1] = childGroups[childGroups.length - 1].add($(this));
}
});
for (var i = 0; i < childGroups.length; ++i) {
childGroups[i].wrapAll('
| ');
}
});
$punchInputParentCells = $punchInputParentCells.not($ambiguousPunchInputParentCells).add($('.unambiguous-parent-cell'));
// When parent cell is hovered, highlight that cell with the 'hovered-cell' class
$punchInputParentCells.hover(
function (event) {
$(event.currentTarget).addClass('hovered-cell');
},
function (event) {
$(event.currentTarget).removeClass('hovered-cell');
}
);
// When parent cell is clicked, click the child punch
$punchInputParentCells.bind('click.gridMouseOver', function (event) {
// Do not fulfill the event when the punch element itself is clicked, nor when an associated textbox (e.g., other specify) is clicked
if ($(event.target).not($punchInputs).not('input[type="text"],textarea').length) {
var $parentCell = $(event.currentTarget);
var $childPunch = $parentCell.find($punchInputs);
// Call the click event on the DOM element itself, to account for the conflicting native "onclick" event
if ($childPunch.length === 1 && !$(event.target).parent('a').length) {
$childPunch[0].click();
}
}
});
// Whenever any punch element is clicked, update the 'selected-cell' state of all parent cells
$punchInputs.bind('click.gridMouseOver', function (event) {
updateParentSelections();
});
// Whenever any textbox is updated, update the 'selected-cell' state of all parent cells (accounts for other specify behavior)
$('input[type="text"],textarea').keyup(function (event) {
updateParentSelections();
});
// When page loads, update the 'selected-cell' state of all parent cells
updateParentSelections();
// Updates the 'selected-cell' state of all parent cells
function updateParentSelections() {
$punchInputParentCells.removeClass('selected-cell');
$punchInputs.filter(':checked').closest($punchInputParentCells).addClass('selected-cell');
}
});