当前位置: 动力学知识库 > 问答 > 编程问答 >

asp.net - Cant seem to hide TableRow on AJAX postback

问题描述:

I wolud like to hide/unhide a TableRow through ASP.NET AJAX when a checkbox is clicked.

I have this code for the checkbox:

<asp:UpdatePanel ID="UpdatePanel2" runat="server">

<ContentTemplate>

<asp:CheckBox runat="server" ID="cbViewPages" Checked="true" OnCheckedChanged="OnViewPages" AutoPostBack="true"/>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTrigger ControlID="cbViewPages" EventName="CheckedChanged"/>

</Triggers>

</asp:UpdatePanel>

and this for the TableRow

 <asp:TableRow runat="server" ID="PagesRow">

<asp:TableCell VerticalAlign="Middle">Test Row</asp:TableCell>

</asp:TableRow>

This method is called when the checkbox is clicked:

 protected void OnViewPages(object sender, EventArgs e)

{

if(cbViewPages.Checked)

{

PagesRow.Visible = true;

}

else

{

PagesRow.Visible = false;

}

}

OnViewPages is definitely called, I can see that through the debugger.

And if I remove the AJAX code, OnViewPages is hidden/unhidden as required.

Why doesn't this hide/unhide functionality work with the AJAX code?

Doh!

I have a partial answer, the TableRow is not in the Update panel.

But you cant put an UpdatePanel around a TableRow.

So that's my new question, how do you put an UpdatePanel around a TableRow?

网友答案:

A couple of options. You could put the update panel around the entire table (this is what Petras is suggesting). You could also use JavaScript to do this. In the event that fires when your checkbox is checked/unchecked, just call

ScriptManager.RegisterStartupScript(Me, Me.GetType(), "setRowVisibility", "setRowVisibility(" & IIf(cbViewPages.Checked, "true", "false") & ");", True)

This will call a JavaScript function you can define on your page like this:

function setRowVisiblity(visible) {
  var row = document.getElementById('<%=PagesRow.ClientID %>');
  if (visible) {
    row.style.display = 'table-row';
  } else {
    row.style.display = 'none';
  }
}

This is MUCH more efficient than using and Update Panel, but it's a little more work. I prefer efficiency, but that's just me. :)

网友答案:

Here's the solution: ASPX page

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="index.aspx.cs" Inherits="index" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">

<asp:ScriptManager ID="scriptMgr" runat="server" />


<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
  <asp:CheckBox runat="server" ID="cbViewPages" Checked="true" OnCheckedChanged="OnViewPages"  AutoPostBack="true"/>


<asp:Table runat="server">

<asp:TableRow>
<asp:TableCell>123</asp:TableCell>
</asp:TableRow>

<asp:TableRow runat="server" ID="PagesRow">
<asp:TableCell>Row To Hide</asp:TableCell>
</asp:TableRow>
</asp:Table>

</ContentTemplate>
  <Triggers>
    <asp:AsyncPostBackTrigger ControlID="cbViewPages" EventName="CheckedChanged"/>
  </Triggers>
</asp:UpdatePanel>


</form>
</body>
</html>

Code behind page:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Net;
using System.IO;

public partial class index : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
  }

  protected void OnViewPages(object sender, EventArgs e)
  {
    if(cbViewPages.Checked)
    {
      PagesRow.Visible = true;
    }
    else
    {
      PagesRow.Visible = false;
    }
  }
}
分享给朋友:
您可能感兴趣的文章:
随机阅读: