我有一个更新面板，在更新面板中我有一个数据网格。在datagrid模板面板中，我有一个标签和datalist。我正在尝试生成一个主要的细节输出。当用户从组合中选择选项然后我绑定datagrid和datalist。我看到它工作正常。但在jquery脚本的帮助下，我试图隐藏div里面有datalist的东西。异步回发后我的脚本无法正常工作。我在异步回发后看到了页面源，发现没有更新数据，但我得到了正确的输出。
1）为什么在更新面板的帮助下，部分回发后没有显示更改。 2）为什么我的jquery脚本无效。
请告诉我如何在用jquery进行部分回发后隐藏我的div，并提及我在哪里犯错误。
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="BBADummyWebSite.Default" %>
<!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>
<style type="text/css">
.style1
{
width: 100%;
}
.layer1
{
margin: 0;
padding: 0;
width: 500px;
}
.heading
{
margin: 1px;
color: #fff;
padding: 3px 10px;
cursor: pointer;
position: relative;
background-color:#c30;
}
.content
{
padding: 5px 10px;
background-color:#fafafa;
}
p { padding: 5px 0; }
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
function foo() {
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);
alert("pp");
}
function endRequestHandler(sender, args) {
// Do your stuff
alert('Update Panel work is done');
VisibilityToggle();
}
/* Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
alert("pp");
VisibilityToggle();
}*/
function VisibilityToggle() {
$(document).ready(function () {
var div = $(this).parent().find('div[id*=divProb]');
$('#heading').click(function () {
var div = $(this).parent().find('div[id*=divProb]');
if (div.css('display') == 'none')
div.show();
else if (div.css('display') == 'block')
div.hide();
});
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<font face="Arial" size="2">
<asp:Label ID="lblMake" runat="server" Text="Vehicle Make"></asp:Label>
<asp:DropDownList ID="cmbMake" runat="server"></asp:DropDownList>
<asp:Button ID="btnGo" runat="server" OnClick="btnGo_Click" Text="Go" />
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" border="0" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<!--<legend>UpdatePanel</legend>-->
<asp:DataGrid ID="dgCat" runat="server" Caption="Categories" CellPadding="4"
ForeColor="#333333" GridLines="Horizontal" AllowSorting="True"
ShowHeader="False" Width="276px"
OnItemDataBound="dgCat_ItemDataBound" Height="231px"
AutoGenerateColumns="False" BackColor="White">
<Columns>
<asp:TemplateColumn HeaderText="Category">
<ItemTemplate>
<table class="style1">
<tr>
<td>
<p class="heading"> <font face="Arial" size="2"> <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl=""
Text='<%# DataBinder.Eval(Container, "DataItem.CatagoryName") %>'></asp:HyperLink></font></p>
</td>
</tr>
<tr>
<td>
<div id="divProb" class="content" >
<asp:DataList ID="lstProb" runat="server" BackColor="White" >
<ItemTemplate>
<table>
<tr>
<td><asp:HyperLink ID="hypProb" runat="server" Text='<%# Eval("Problem") %>' NavigateUrl="http://www.bba-reman.com"></asp:HyperLink>
</td>
</tr>
</table>
</ItemTemplate>
</asp:DataList>
</div>
</td>
</tr>
</table>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
<EditItemStyle BackColor="#999999" />
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<ItemStyle BackColor="#F7F6F3" ForeColor="#333333" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<SelectedItemStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
</asp:DataGrid>
</fieldset>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnGo" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</font>
</form>
</body>
</html>
答案 0 :(得分：0)
尝试删除Foo（）函数，让endRequest事件处理程序直接在tag中。 如果这没有用，请尝试使用ScriptManager.RegisterClientScriptBlock从OnPreRender页面事件中的代码隐藏中注册VisibilityToggle（）javascript。