C# 如何在ASP.Net中单击按钮时显示/隐藏面板
我在单击按钮时显示或隐藏面板时遇到问题。默认情况下,面板是隐藏的,但我希望一旦单击按钮,面板就会显示出来,现在它对我不起作用 面板显示的唯一时间是当另一个回发发生时,例如当我选择下拉并触发回发时,我的面板将显示。我认为问题在于我使用的是UpdatePanel,而它只是做了一部分回复 下面是我将AsyncPostBackTrigger用于控制按钮的代码C# 如何在ASP.Net中单击按钮时显示/隐藏面板,c#,asp.net,updatepanel,panel,C#,Asp.net,Updatepanel,Panel,我在单击按钮时显示或隐藏面板时遇到问题。默认情况下,面板是隐藏的,但我希望一旦单击按钮,面板就会显示出来,现在它对我不起作用 面板显示的唯一时间是当另一个回发发生时,例如当我选择下拉并触发回发时,我的面板将显示。我认为问题在于我使用的是UpdatePanel,而它只是做了一部分回复 下面是我将AsyncPostBackTrigger用于控制按钮的代码 <div id="dvGrid" style="padding: 10px; width: 876px"> <a
<div id="dvGrid" style="padding: 10px; width: 876px">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" Width="870px" OnRowDataBound="RowDataBound"
AutoGenerateColumns="False" Font-Names="Arial" Font-Size="11pt" AlternatingRowStyle-BackColor="#C2D69B"
HeaderStyle-BackColor="green" ShowFooter="True" OnPageIndexChanging="OnPaging"
DataKeyNames="DEV_SK">
<AlternatingRowStyle BackColor="#C2D69B" />
<Columns>
<asp:TemplateField ItemStyle-Width="30px" HeaderText="ID" Visible = "false">
<ItemTemplate>
<asp:Label ID="lblDEV_SK" runat="server" Text='<%# Eval("DEV_SK")%>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="10px" />
</asp:TemplateField>
</asp:GridView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnUpdate" />
</Triggers>
</asp:UpdatePanel>
</div>
这是我的小组:
<div>
<asp:Panel ID="Panel1" runat="server" BorderStyle="Groove" Height="109px" Visible="false"
Width="870px" BackColor="#FFFFE1">
<asp:Label ID="Label2" runat="server" Text="SIGN" Font-Bold="True"
ForeColor="#FF3300"></asp:Label>
<br />
<br />
<asp:Label ID="lblUID" runat="server" Text="User ID:"></asp:Label>
<asp:TextBox ID="txtUID" runat="server" Height="22px" Width="145px"></asp:TextBox>
<asp:Label ID="lblPass" runat="server" Text="Password:"></asp:Label>
<asp:TextBox ID="txtPass" runat="server" Height="23px" TextMode="Password" style="margin-top: 0px"></asp:TextBox>
<br />
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" Width="183px"
onclick="btnSubmit_Click"
OnClientClick="return confirm('Are you sure you want to submit?');"
Font-Bold="False" Font-Size="Medium" Height="30px"
style="margin-right: 1px" />
<br />
</asp:Panel>
</div>
因为您已经拥有DOM元素的ID,所以可以使用JQuery来实现这一点
<head>
<script src='https://code.jquery.com/jquery-1.12.4.min.js' >
<script>
$(document).ready( function() {
$('#btnSubmit').click(function(e) {
$('#Panel1').toggle(); //Show or Hide
e.preventDefault();
});
});
</script>
Panel1的实际控制在哪里?Yuriy,我刚在我的第一篇文章中添加了面板代码。请查看topSo面板1是否在UpdatePanel之外?是的,它在UpdatePanel之外,那么指定为UpdatePanel的AsyncPostBackTrigger的按钮不会影响它。您需要将面板放置在第一个UpdatePanel的内部或其自身的UpdatePanel的内部
<div>
<asp:Panel ID="Panel1" runat="server" BorderStyle="Groove" Height="109px" Visible="false"
Width="870px" BackColor="#FFFFE1">
<asp:Label ID="Label2" runat="server" Text="SIGN" Font-Bold="True"
ForeColor="#FF3300"></asp:Label>
<br />
<br />
<asp:Label ID="lblUID" runat="server" Text="User ID:"></asp:Label>
<asp:TextBox ID="txtUID" runat="server" Height="22px" Width="145px"></asp:TextBox>
<asp:Label ID="lblPass" runat="server" Text="Password:"></asp:Label>
<asp:TextBox ID="txtPass" runat="server" Height="23px" TextMode="Password" style="margin-top: 0px"></asp:TextBox>
<br />
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" Width="183px"
onclick="btnSubmit_Click"
OnClientClick="return confirm('Are you sure you want to submit?');"
Font-Bold="False" Font-Size="Medium" Height="30px"
style="margin-right: 1px" />
<br />
</asp:Panel>
</div>
<head>
<script src='https://code.jquery.com/jquery-1.12.4.min.js' >
<script>
$(document).ready( function() {
$('#btnSubmit').click(function(e) {
$('#Panel1').toggle(); //Show or Hide
e.preventDefault();
});
});
</script>