UpdatePanel 启动脚本未执行
Posted
技术标签:
【中文标题】UpdatePanel 启动脚本未执行【英文标题】：UpdatePanel startup script not executing 【发布时间】：2010-12-11 16:50:52 【问题描述】：我正在编写一个用于 SharePoint 网站的 ASP.NET Web 部件，并尝试使用 UpdatePanel 来呈现查询结果。我想使用 JQuery 插件来修改从异步回发返回的表，但是我无法让启动脚本在异步 udpate 上执行。
我找到了indicates that the UpdatePanel won't do an eval() on startup scripts; instead, you must register the startup script block with the ScriptManager 的帖子。这一切都是有道理的，直到它不起作用。 MSDN reference documentation seems to concur 与那里采取的方法。
我的控件太长，无法完整发布，但这里有一个精简的表示，我认为它涵盖了所有相关内容。如果下面的粘贴中缺少控件，请原谅我 - 我不得不删除一些部分，并且可能有一些悬垂的触手，可以这么说。下面是 webpart 的代码，与加载用户控件 (.ascx) 的 SmartPart 没有什么不同。
如您所见，我使用的是 ScriptManager.RegisterStartupScript 方法。我已经尝试过两种重载；一次用于页面，一次用于更新面板中的 ListView（重命名为“AspListView”）。在这两种情况下，启动脚本都不会在异步更新时执行，我不知道为什么。
using System;
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.InteropServices;
using System.Text;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Serialization;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using Microsoft.SharePoint.WebPartPages;
namespace MyNamespace
using AspListView = System.Web.UI.WebControls.ListView;
[Guid("601b3bdb-ed2a-4ec8-8a40-c37de8ab048d")]
public class ListSearch : StaticTemplateWebPart
private AspListView resultsList;
public ListSearch()
protected override void CreateChildControls()
base.CreateChildControls();
ScriptLink.Register(Page, "jquery-1.3.2.js", false);
ScriptLink.Register(Page, "jquery-ui-1.7.2.custom.min.js", false);
ScriptLink.Register(Page, "jquery.timepickr.js", false);
ScriptLink.Register(Page, "jquery.quicksearch.js", false);
string scriptBlock =
@"
if ($('table#discrepancy-results').length)
$('table#discrepancy-results tr').quicksearch(
position: 'before',
attached: 'table.results',
stripeRowClass: ['odd', 'even'],
labelText: 'Keyword Search'
);
";
ScriptManager.RegisterStartupScript(Page, typeof(Page), UniqueID, scriptBlock, true);
/* adding other controls, getting references, databinding, etc. */
void searchButt_Click(object sender, EventArgs e)
if (Page.IsPostBack)
var beginDT = DateTime.Parse((beginDateText.Text ?? "") + " " + (beginTimeText.Text ?? ""));
var endDT = DateTime.Parse((endDateText.Text ?? "") + " " + (endTimeText.Text ?? ""));
var dataList = SPContext.Current.Web.Lists["MyDataList"].Items;
var results = SearchListItems(dataList, beginDT, endDT, keywordText.Text ?? "");
if (results.Count > 0)
resultsList.DataSource = results;
resultsList.DataBind();
以及被加载的用户控件：
<%@ Control Language="C#" ClassName="ListSearchControl" %>
<% if (false)
%>
<script src="../../LAYOUTS/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<% %>
<script type="text/javascript">
$(function()
$('id').trigger('click');
$('#<%= BeginTime.ClientID %>').timepickr(
handle: '#<%= BeginTimeTrigger.ClientID %>',
convention: 12,
trigger: 'nothing'
);
$('#<%= EndTime.ClientID %>').timepickr(
handle: '#<%= EndTimeTrigger.ClientID %>',
convention: 12,
trigger: 'nothing'
);
);
</script>
<asp:Panel ID="ControlPanel" runat="server">
<asp:Panel ID="Inputs" runat="server">
<asp:Panel CssClass="DateInputWrapper" runat="server">
<asp:Panel CssClass="BeginDateInput" runat="server">
<asp:Label Text="Begin Date: " runat="server" />
<asp:TextBox ID="BeginDate" Columns="14" runat="server"></asp:TextBox>
<asp:Image ID="BeginDateImg" ImageUrl="/_layouts/Images/calendar.gif" runat="server" />
<ajax:CalendarExtender ID="BeginDateExtender" TargetControlID="BeginDate" PopupButtonID="BeginDateImg"
Format="MMMM d, yyyy" runat="server">
</ajax:CalendarExtender>
<asp:Label Text="Begin Time: " runat="server" />
<asp:TextBox ID="BeginTime" Columns="6" Text="04:00 am" runat="server"></asp:TextBox>
<asp:Image ID="BeginTimeTrigger" runat="server" ImageUrl="/_layouts/1033/Images/clock.png" />
</asp:Panel>
<asp:Panel CssClass="EndDateInput" runat="server">
<asp:Label Text="End Date: " runat="server" />
<asp:TextBox ID="EndDate" Columns="14" runat="server"></asp:TextBox>
<asp:Image ID="EndDateImg" ImageUrl="/_layouts/Images/calendar.gif" runat="server" />
<ajax:CalendarExtender ID="EndDateExtender" TargetControlID="EndDate" PopupButtonID="EndDateImg"
Format="MMMM d, yyyy" runat="server">
</ajax:CalendarExtender>
<asp:Label Text="End Time: " runat="server" />
<asp:TextBox ID="EndTime" Columns="6" Text="03:59 am" runat="server"></asp:TextBox>
<asp:Image ID="EndTimeTrigger" runat="server" ImageUrl="/_layouts/1033/Images/clock.png" />
</asp:Panel>
</asp:Panel>
<asp:Panel CssClass="Submit" runat="server">
<asp:Button ID="SearchButton" Text="Search" runat="server" />
<asp:Label CssClass="SearchStatusText" runat="server" />
</asp:Panel>
</asp:Panel>
</asp:Panel>
<asp:Panel ID="ResultsPanel" runat="server">
<asp:ListView ID="ResultsList" runat="server">
<LayoutTemplate>
<table id="discrepancy-results">
<tr class="header-row">
<th>Scheduled Date/Time</th>
<th>Code</th>
<th>Description</th>
</tr>
<asp:PlaceHolder runat="server" ID="itemPlaceHolder" />
</table>
</LayoutTemplate>
<ItemTemplate>
<tr class="result-row">
<td><%# Eval("ScheduledDate") %></td>
<td><%# Eval("Code") %></td>
<td><%# Eval("Description") %></td>
</tr>
</ItemTemplate>
</asp:ListView>
</asp:Panel>
<asp:Panel ID="DetailsPanel" runat="server">
</asp:Panel>
【问题讨论】：
当您查看渲染页面的源代码时，那里的 javascript 是否存在？这可能会提供一些线索... 玩了一会儿之后，我让它工作了。我认为问题在于我只是以某种方式错误地使用了 quicksearch() 。我后来尝试了一个简单的 alert() 并且效果很好。 【参考方案1】：我想补充一点，除非您使用 UpdatePanel's ID 和 typeof(UpdatePanel)，否则 updatepanel 启动脚本对我们不起作用。在更新面板之外的其他地方使用启动脚本并不那么挑剔。我们的工作方式如下：
ScriptManager.RegisterStartupScript(UpdatePanelId, typeof(UpdatePanel), "myScript",
/ *
* Register a startup script to run
* on the client after running this method on the server
* /
@" alert('Add your function to replace this.');", true);
Darin 提出的解决方案也可以，但在我们的例子中，更新面板具有更多功能，并且需要额外的逻辑来“跟踪”正在执行的操作，因此脚本不会在更新面板的每次更新时执行，但仅在某个事件之后。这样脚本只会在这个事件上执行。
【讨论】：
在这之前我尝试了很多不同的解决方案，但都没有奏效。这个在我的用户控制范围内工作得很好【参考方案2】：除了使用ScriptManager.RegisterStartupScript，您还可以尝试其他方法。注册 UpdatePanel 的 end_request 事件并执行您的 jQuery 脚本：
// This could also be done in jQuery's $(document).ready
function pageLoad()
Sys.WebForms
.PageRequestManager
.getInstance()
.add_endRequest(endRequestHandler);
function endRequestHandler(sender, args)
// Shouldn't the next test be:
// $('table#discrepancy-results').length > 0 ???
// and is it necessary at all? I suppose the quicksearch plugin
// won't apply on empty array
if ($('table#discrepancy-results').length)
$('table#discrepancy-results tr').quicksearch(
position: 'before',
attached: 'table.results',
stripeRowClass: ['odd', 'even'],
labelText: 'Keyword Search'
);
【讨论】：
【参考方案3】：ScriptManager.RegisterStartupScript 采用参数key，您将其设置为控件的UniqueID。此键在页面脚本执行期间需要是唯一的。所以，你应该改变这一行：
ScriptManager.RegisterStartupScript(Page, typeof(Page), UniqueID, scriptBlock, true);
与
ScriptManager.RegisterStartupScript(Page, typeof(Page), Guid.NewGuid(), scriptBlock, true);
或您喜欢的其他方式来生成唯一密钥。
【讨论】：
【参考方案4】：在玩了一会儿之后，我开始工作了。我认为问题在于我只是以某种方式错误地使用了 quicksearch() 。我后来尝试了一个简单的 alert() 并且效果很好。感谢您的建议！
【讨论】：
以上是关于UpdatePanel 启动脚本未执行的主要内容，如果未能解决你的问题，请参考以下文章
具有嵌入式 init.d 脚本的 Spring Boot 应用程序未在重新启动时启动
启动脚本未在启用自动缩放的 GCP Compute Engine Windows 服务器上运行