function toggleRow(tr)
{
	// Get the numeric part of the row id.
    var matchIdRow = tr.id;
    var _position = matchIdRow.indexOf("_") + 1;
    matchIdRow = matchIdRow.substr(_position, matchIdRow.length - _position);
	
	// Get the expand/collapse image by id.
    var image = document.getElementById("ExpandCollapse_" + matchIdRow);
    
    var helpTextRow = document.getElementById("HelpTextRow_" + matchIdRow);
	
	// Expand or collapse the next row and switch the expand/collapse image.
	if (tr.className == "ToggleOff")
	{
		tr.className = "ToggleOn";
		image.src = "/images/collapse.gif";
		image.title = "Hide match details";

		// Get the next row under this and expand it.
		var nextTr = getNextRow(tr);
		nextTr.style.display = '';
		var innerDiv = document.getElementById("InnerMatchId_" + matchIdRow);
		if (innerDiv != null) {
		    var status = innerDiv.getAttribute("status");
		    if (status == null || status == "0") {
	            // get the match details
		        TheFA.CountyFA.Web.UserControls.Interaction.GetCountyRepMatchDetailsDataHandler.GetCountyRepMatchDetails(matchIdRow, SucceededCallback);
		    }
		}
		if (helpTextRow != null) {
		    helpTextRow.style.display = 'none';
		}
	}
	else
	{
		tr.className = "ToggleOff";
		image.src = "/images/expand.gif";
		image.title = "Show match details";

		// Get the next row under this and collapse it.
		var nextTr = getNextRow(tr);
		nextTr.style.display = 'none';
		if (helpTextRow != null) {
		    helpTextRow.style.display = '';
		}
	}
}

// This is the callback function that
// processes the Web Service return value.
function SucceededCallback(result) {
    if (result.length > 0) {
        var matchIdStartPos = result.indexOf("matchid=");
        if (matchIdStartPos != -1) {
            matchIdStartPos = matchIdStartPos + 9;
            var matchIdEndPos = result.indexOf("\"", matchIdStartPos);
            if (matchIdEndPos > matchIdStartPos) {
                var matchId = result.substr(matchIdStartPos, matchIdEndPos - matchIdStartPos);
                var innerDiv = document.getElementById("InnerMatchId_" + matchId);
                if (innerDiv != null) {
                    innerDiv.setAttribute("status", "1");
                    innerDiv.innerHTML = result;
                }
            }
        }
    }
}

function getNextRow(currentRow)
{
	if(currentRow.parentElement)
	{
		var row = currentRow.parentElement.rows[currentRow.rowIndex + 1];				
	}
	else
	{
		var row = currentRow.parentNode.rows[currentRow.rowIndex + 1];		
	}
	return row;
}