Question

我正在使用ajax和C＃在网站上工作。几个月前我开始学习这些语言，所以我并不总是确定最佳实践是什么。

我有一个表单，根据用户的操作，需要隐藏或显示某些控件。它开始显示“id”字段（以及其他字段），但如果用户不知道他们的id，他们会点击一个链接，导致“id”字段隐藏并显示包含其他控件的表格一个“查找”按钮。我目前正在使用Javascript来处理点击并隐藏/显示控件：

function showSearchTable() {
    document.getElementById('IDNumberRow').style.display = 'none';
    document.getElementById('DontKnowId').style.display = 'none';
    document.getElementById('infoSearchTable').style.display = 'block';
}

单击“查找”按钮时，应用程序会尝试在数据库中查找其他信息并告知用户结果。作为服务器调用的结果，页面被重新加载，这导致表再次被隐藏。这是我的问题：如果找不到电话号码，我想保持表格可见，以便用户可以纠正任何错误。

我尝试添加代码使表格隐藏在代码隐藏中，以便回发不会导致表格变得不可见：

protected void Page_Load(object sender, EventArgs e)
{
    if(!Page.IsPostBack)
    {
        infoSearchTable.Visible = false;
    }
}

但是，由于表现在包含属性runat =“server”以便在c＃代码中看到它，我似乎无法在我的javascript代码中引用它以便从客户端设置它。我试过这个javascript：

function showSearchTable() {
    document.getElementById('IDNumberRow').style.display = 'none';
    document.getElementById('DontKnowId').style.display = 'none';

    var infoSearch = document.getElementById('<%=infoSearchTable.ClientID%>');
    infoSearch.style.display = 'block';
}

和表格的html：

<table id="infoSearchTable" runat="server">
....table rows/columns containing controls
</table>

但是我收到一条错误消息，说'infoSearch'为空。

我想我能够完成这两项任务（用Javascript设置隐藏表，但在帖子后面保持可见），但我认为我的代码最终会变得比必要的更复杂，尤其是当我我是ajax，.net和C＃的新手。所以我正在寻求建议 - 我是否走在正确的轨道上？我用错了方法吗？还有另一种方法吗？

Answer 1

if(!Page.IsPostBack)
{
    infoSearchTable.Visible = false;
}

我认为这会阻止控件被发送回客户端（因此是空引用） - 尝试类似：

if(!Page.IsPostBack)
{
    infoSearchTable.Attributes.Add("style", "display: none;");

}

Answer 2

你可以做那样的事情

<table id="infoSearchTable" runat="server">
....table rows/columns containing controls
</table>

并在

背后的代码中

infoSearchTable.Attributes.Add("class", "yourclass");

in youe .css

.yourclass{display:none;}

Answer 3

将runat="server"添加到元素后，您必须通过JavaScript中的ClientID引用它：

var table = document.getElementById("<%=infoSearchTable.ClientID%>");
if (table){
    table.style.display = "none";
}

Answer 4

在ASP.NET中使用runat=server时，它会获取您的ID并修改它以包含程序中的其他信息，但我完全忘记了主页或命名空间或其他什么使它成为唯一的。您的getElementByID（）需要更改为包含所有其他信息（在页面上查看源以获取实际ID）或使用具有高级选择器的JQuery等javascript框架来查找页面上的元素。

使用C＃和Javascript隐藏/显示html表

4 个答案: