我试图从服务器端显示弹出模型，但它不起作用。我不知道我在哪里做错了。我的webform页面继承自Master Page.All引导程序文件包含在主文件头中。以下是Web表单页面的客户端代码：
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.Master" AutoEventWireup="true" CodeBehind="UploadDocument.aspx.cs" Inherits="DMS_WebApp.UploadDocument" %>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<section class="panel">
<header class="panel-heading">
Upload Documents
</header>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<div class="row">
<div class="col-md-12">
<asp:GridView ID="GridView1" runat="server" CssClass="table table-striped table-advance table-hover" AutoGenerateColumns="true"
Style="max-width: 500px">
<Columns>
<asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:Button ID="btnEdit" runat="server" Text="Edit" OnClick="Edit" class="btn btn-primary" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Bootstrap Modal Dialog -->
<div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<asp:UpdatePanel ID="upModal" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">
<asp:Label ID="lblModalTitle" runat="server" Text=""></asp:Label></h4>
</div>
<div class="modal-body">
<asp:Label ID="lblModalBody" runat="server" Text=""></asp:Label>
</div>
<div class="modal-footer">
<button class="btn btn-info" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</asp:Content>
服务器端代码如下：
protected void Add(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "myModal", "$('#myModal').modal('show');", true);
upModal.Update();
}
答案 0 :(得分：0)
使用服务器端代码来控制客户端控件并不是一个好的编程。如果您可以将所有客户端呼叫保留在客户端的浏览器上，并远离服务器，那就更好了。不幸的是，并非所有情况都支持这种情况，有时我们必须使用服务器端脚本来控制客户端浏览器功能，以获得良好的用户体验和其他商业原因。
例如：
允许＆＃39;假设你想要一个弹出窗体让用户能够创建新的登录...
以下是一个示例：
<asp:UpdatePanel ID="upADDMAIN" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="btnADD" runat="server" Text="NEW LOGIN" BackColor="Blue" Font-Bold="True" ForeColor="#FFFFCC" OnClick="btnADD_Click" />
<asp:Button ID="btnDUM" runat="server" style="display:none" />
<div style="height:20px">
</div>
<ajaxToolkit:ModalPopupExtender ID="mpeADD" runat="server"
targetcontrolid="btnDUM"
popupcontrolid="pnlADD"
backgroundcssclass="modelbackground">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="pnlADD" runat="server" Width="750px" HorizontalAlign="Center" CssClass="auto-style10" Height="250px">
<div class="hdr" id="puHDR">
<div class="text-center" style="background-color: #FFCC66; height:30px; vertical-align:middle">
<strong style="background-color: #FFCC66; vertical-align: middle;">ENTER NEW LOGIN DETAILS</strong></div>
</div>
<div class="auto-style31" id="puBDY">
<table style="padding: 2px; text-align: left; vertical-align: top;" class="auto-style4">
<tr style="text-align:left;height:10px">
<td class="auto-style32" style="vertical-align: top; " colspan="4"></td>
</tr>
<tr style="text-align:left;">
<td class="auto-style5" style="vertical-align: top; width: 5%;"></td>
<td class="auto-style2" style="vertical-align: top"><strong>POTL Login ID</strong></td>
<td class="auto-style7" style="vertical-align: top">
<asp:TextBox ID="txtLOGIN" runat="server" ValidationGroup="vgAdd"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtLogin" Display="Dynamic" ErrorMessage="* Required" SetFocusOnError="True" ValidationGroup="vgAdd"></asp:RequiredFieldValidator>
<asp:CustomValidator ID="cv1" runat="server" ControlToValidate="txtLOGIN" Display="Dynamic" ErrorMessage="This login already exits!" OnServerValidate="cv1_ServerValidate" ValidateEmptyText="true" ValidationGroup="vgAdd"></asp:CustomValidator>
</td>
<td class="auto-style3" style="width: 10%;">
<asp:CheckBox ID="cbISActive" runat="server" Checked="True" CssClass="myCheckBox" TabIndex="4" Text="Active? " TextAlign="Left" ValidationGroup="vgAdd" Width="100%" />
</td>
</tr>
<tr style="text-align:left;height:40px">
<td class="auto-style25" style="vertical-align: top; width: 5%;"> </td>
<td class="auto-style18" style="vertical-align: top"><strong>Password</strong></td>
<td class="auto-style36" style="vertical-align: top">
<asp:TextBox ID="txtPWD" runat="server"
TextMode="Password"
ToolTip="Enter at least an 8 character password with a mix of numbers, capitals, and letters."
ValidationGroup="vgAdd" TabIndex="1"></asp:TextBox>
<asp:CheckBox ID="cbShow" runat="server" />
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server"
ControlToValidate="txtPWD"
ErrorMessage="* Required"
ValidationGroup="vgAdd"
Display="Dynamic"
SetFocusOnError="True"></asp:RequiredFieldValidator>
</td>
<td style="width: 10%;" class="auto-style37"> </td>
</tr>
<tr style="text-align:left;height:40px">
<td class="auto-style25" style="vertical-align: top; width: 5%;"> </td>
<td class="auto-style18" style="vertical-align: top"><strong>Password (CONFIRM)</strong></td>
<td class="auto-style36" style="vertical-align: top">
<asp:TextBox ID="txtPWDCONF" runat="server"
TextMode="Password"
ToolTip="Enter at least an 8 character password with a mix of numbers, capitals, and letters."
ValidationGroup="vgAdd" TabIndex="2"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
ControlToValidate="txtPWDCONF"
ErrorMessage="* Required"
SetFocusOnError="True"
Display="Dynamic"
ValidationGroup="vgAdd"></asp:RequiredFieldValidator>
<asp:CompareValidator ID="CompareValidator1" runat="server"
ControlToValidate="txtPWDCONF"
ValidationGroup="vgAdd"
SetFocusOnError="true"
Display="Dynamic"
ControlToCompare="txtPWD"
ErrorMessage="Passwords do not match!" />
</td>
<td style="width: 10%;" class="auto-style37"> </td>
</tr>
<tr style="text-align:left;">
<td class="auto-style27" style="vertical-align: top; width: 5%;"></td>
<td class="auto-style28" style="vertical-align: top;"><strong>Default Agent</strong></td>
<td class="auto-style29" style="vertical-align: top;">
<asp:DropDownList ID="ddlAgent" runat="server" AppendDataBoundItems="true" Width="370px"
DataSourceID="sdsDEBmaster2" DataTextField="AgentName" DataValueField="AgentID" ValidationGroup="vgAdd" TabIndex="3">
<asp:ListItem Selected="True" Value="0">Select...</asp:ListItem>
</asp:DropDownList>
<asp:SqlDataSource ID="sdsDEBmaster2" runat="server" ConnectionString="<%$ ConnectionStrings:SpotConnectionString %>"
SelectCommand="SELECT ...blahblah"></asp:SqlDataSource>
</td>
<td style="width: 10%;" class="auto-style30">
<asp:RequiredFieldValidator ID="rfvddl0" runat="server"
ControlToValidate="ddlAgent"
InitialValue="0"
ErrorMessage="* Required"
ValidationGroup="vgAdd"
Display="Dynamic"
SetFocusOnError="True"></asp:RequiredFieldValidator>
</td>
</tr>
<tr style="text-align:left;height:40px">
<td class="text-center" style="vertical-align: top; " colspan="4">
<asp:Button ID="btnOK" runat="server"
CausesValidation="true"
OnClick="btnOK_Click"
style="width: 80px"
TabIndex="5"
Text="OK"
UseSubmitBehavior="true"
ValidationGroup="vgAdd" />
<asp:Button ID="btnCAN" runat="server"
CausesValidation="False"
OnClick="btnCAN_Click"
style="width: 80px"
TabIndex="6"
Text="CANCEL" />
</td>
</tr>
</table>
</div>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
忽略验证器，但在这些情况下，他们会很方便地知道。
正如您所看到的那样，我有一个UpdatePanel围绕着整个地段，MPE控件和Panel控件具有我的表单控件（无需实际创建一个asp：form控制！）。
代码背后......
protected void btnADD_Click(object sender, EventArgs e)
{
ClearADDform();
mpeADD.Show(); //show the MPE control when the user has clicked the ADD button control
}
protected void btnOK_Click(object sender, EventArgs e)
{
Page.Validate("vgAdd");
if (Page.IsValid)
{
try
{
//blahblah
//hide the mpe
mpeADD.Hide();
//reload the page
Page.Response.Redirect(Page.Request.Url.ToString(), true);
}
catch (Exception exc)
{
ScriptManager.RegisterStartupScript(this, GetType(), "ServerControlScript", "alert('" + exc.Message + "');", true);
}
}
else
//show the mpe and continue showing until either CANCEL or fields are validated
mpeADD.Show();
}
protected void btnCAN_Click(object sender, EventArgs e)
{
mpeADD.Hide();
}
protected void ClearADDform()
{
txtLOGIN.Text = string.Empty;
cbISActive.Checked = true;
txtPWD.Text = string.Empty;
ddlAgent.SelectedIndex = -1;
}
这是一个非常基本的例子，说明如何从客户端和服务器端管理AjaxControlToolKit的ModalPopupExtender控件。