javascript - 为什么我的行设置为可见后不可见？

Question

我有一个有六行的表格，但开始时只有两行可见(一个标题行和一个“业务”行)。

用户可以选择一个按钮，一次添加一个额外的行(实际上，它只是使现有的行可见)，总共六行/五个“业务”行。

第 2-6 行首先通过此代码隐藏隐藏:

foapalrow3.Style["display"] = "none";

(foapalrow4、foapalrow5 和 foapalrow6 使用相同的代码)。

然后当用户选择“+”按钮时，它们会通过 jQuery 显示:

/* This makes the next hidden row visible, as long as there is one */
$(document).on("click", '[id$=btnAddFoapalRow]', function (e) {
    $('[id$=foapalhtmltable]').find('tr:hidden:first').show();
});

这很好用。问题是，当提交表单时，先前可见的行恢复为隐藏状态(除了前两个之外的所有行)。我正在尝试添加代码，如果其中的任何文本输入被赋予一个值，这些代码将重新显示这些行。 IOW，如果我像这样在每一行中给“索引”列一个值:

....我希望它们再次可见，因为它们确实具有值(value):

...并且它们的可见属性确实是“真”:

...但是这些行仍然顽固地隐藏在它们的洞穴中。这是背后的代码:

private void btnSave_Click(object sender, EventArgs e)
{
    try
    {
        . . . // code elided for brevity
        ConditionallyCreateList();
        SaveInputToList();
        listOfListItems = ReadFromList();
        message.Text = "Saving the data has been successful";

        // Expose any rows with vals
        if (RowContainsVals(3))
        {
            foapalrow3.Visible = true;
        }
        if (RowContainsVals(4))
        {
            foapalrow4.Visible = true;
        }
        if (RowContainsVals(5))
        {
            foapalrow5.Visible = true;
        }
        if (RowContainsVals(6))
        {
            foapalrow6.Visible = true;
        }

        . . . // code elided for brevity
    }
    catch (Exception ex)
    {
        message.Text = String.Format("Exception occurred: {0}", ex.Message);
    }
}

private bool RowContainsVals(int rownum)
{
    bool rowdirty = false;
    switch (rownum)
    {
        case 3:
            rowdirty = ((!String.IsNullOrEmpty(boxFund2.Text)) ||
                (!String.IsNullOrEmpty(boxIndex2.Text)) ||
                (!String.IsNullOrEmpty(boxOrganization2.Text)) ||
                (!String.IsNullOrEmpty(boxAccount2.Text)) ||
                (!String.IsNullOrEmpty(boxActivity2.Text)) ||
                (!String.IsNullOrEmpty(boxAmount2.Text)));
            break;
        case 4:
            rowdirty = ((!String.IsNullOrEmpty(boxFund3.Text)) ||
                (!String.IsNullOrEmpty(boxIndex3.Text)) ||
                (!String.IsNullOrEmpty(boxOrganization3.Text)) ||
                (!String.IsNullOrEmpty(boxAccount3.Text)) ||
                (!String.IsNullOrEmpty(boxActivity3.Text)) ||
                (!String.IsNullOrEmpty(boxAmount3.Text)));
            break;
        case 5:
            rowdirty = ((!String.IsNullOrEmpty(boxFund4.Text)) ||
                (!String.IsNullOrEmpty(boxIndex4.Text)) ||
                (!String.IsNullOrEmpty(boxOrganization4.Text)) ||
                (!String.IsNullOrEmpty(boxAccount4.Text)) ||
                (!String.IsNullOrEmpty(boxActivity4.Text)) ||
                (!String.IsNullOrEmpty(boxAmount4.Text)));
            break;
        case 6:
            rowdirty = ((!String.IsNullOrEmpty(boxFund5.Text)) ||
                (!String.IsNullOrEmpty(boxIndex5.Text)) ||
                (!String.IsNullOrEmpty(boxOrganization5.Text)) ||
                (!String.IsNullOrEmpty(boxAccount5.Text)) ||
                (!String.IsNullOrEmpty(boxActivity5.Text)) ||
                (!String.IsNullOrEmpty(boxAmount5.Text)));
            break;
        default:
            rowdirty = false;
            break;
    }
    return rowdirty;
}

但是，这就是我在代码运行后看到的所有内容:

那么为什么将 visible 属性设置为 visible 并没有真正将它们设置为可见？

更新

注意:如果我通过“+”按钮重新展开行，它们确实包含我添加到它们的值。所以这些行仍然存在并保留它们的数据，它们只是不想显示自己......

Answer 1

尝试更改您的代码以使用 Style["display"] = "table-row"; 而不是 Visible = true;

您说在代码中，通过设置样式 display:none 使行后面的行“不可见”。

请注意，在 asp.net 中，使控件可见与通过样式使其不可见不同。

Control.Visible = false 将不会在客户端呈现 HTML 代码，而设置 display:none 将使用隐藏该行的样式呈现它浏览器。我假设这是你的情况，因为你说你在客户端隐藏和显示行并且为了做到这一点它们必须存在于客户端所以我假设你的代码中没有任何地方它们是 Visible = false ;