There is a table with six rows, but initially only two are visible - a header row and one "business" row.
A button allows the user to add additional rows one at a time (making existing rows visible), up to a maximum of six rows / five "business" rows.
The code-behind sets rows 2-6 as invisible:
foapalrow3.Style["display"] = "none";
(the same for foapalrow4, foapalrow5, and foapalrow6).
To make these rows visible when the user clicks the "+" button, jQuery is used:
/* This makes the next hidden row visible, if there is one */
$(document).on("click", '[id$=btnAddFoapalRow]', function (e) {
$('[id$=foapalhtmltable]').find('tr:hidden:first').show();
});
This functionality works correctly. However, upon form submission, the previously visible rows revert back to being hidden (except the first two). We need to ensure that any row containing input values remains visible. For example, if the "Index" column in each row has a value, they should be made visible again. The code snippet for this behavior is as follows:
// Expose any rows with values
if (RowContainsVals(3))
{
foapalrow3.Visible = true;
}
if (RowContainsVals(4))
{
foapalrow4.Visible = true;
}
if (RowContainsVals(5))
{
foapalrow5.Visible = true;
}
if (RowContainsVals(6))
{
foapalrow6.Visible = true;
}
UPDATE
After running the above code, the rows remain hidden even though they contain values. It seems like setting the visible property to true does not actually make them visible.
It's worth mentioning that manually expanding the rows using the "+" button reveals that the rows do indeed have the added values. So, the issue seems to be related to displaying them visually.