2009-10-30 205 views
3

我在写一个ASP.NET webpart用于SharePoint网站,并试图使用UpdatePanel来呈现查询结果。我想使用JQuery插件来修改从异步回发返回的表,但我在获取启动脚本在异步udpate上执行时遇到问题。UpdatePanel启动脚本不执行

我发现这个帖子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> 
+0

当您查看呈现的页面的源代码时,是否存在某处的JavaScript?这可能会给一些线索...... – codeulike

+0

玩了一下之后,我就开始工作了。我认为问题在于我只是在某种程度上错误地使用了quicksearch()。我稍后尝试了一个简单的alert(),它工作正常。 –

回答

0

用它打了一下后,我得到它的工作。我认为问题在于我只是在某种程度上错误地使用了quicksearch()。我稍后尝试了一个简单的alert(),它工作正常。感谢您的建议!

3

除了在此处使用ScriptManager.RegisterStartupScript的是别的东西,你可以尝试。注册为end_request事件在UpdatePanel和执行你的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' 
     }); 
    } 
} 
6

我想补充说,updatepanel startupscripts不会对我们有效,除非您使用UpdatePanel's IDtypeof(UpdatePanel)。在updatepanel之外的其他地方使用startupscript并不那么挑剔。我们得到了这方面的工作是这样的:

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); 

由达林提出的解决方案将工作为好,但在我们的例子中的UpdatePanel有更多的功能,将需要额外的逻辑来“跟踪”做了哪些工作,使该脚本不会告发不会对更新面板进行每次更新,而只会在某个事件发生后执行。这样脚本只能在这个事件上执行。

+0

OMG你救了我! –

+0

在这个之前我尝试了很多不同的解决方案,但都没有工作。这个在我的用户控制内完美无缺 –

1

ScriptManager.RegisterStartupScript需要一个参数关键,您所设定的控制的的UniqueID。在执行页面脚本时,此键必须是唯一的。所以,你应该改变这一行:

ScriptManager.RegisterStartupScript(Page, typeof(Page), UniqueID, scriptBlock, true); 

ScriptManager.RegisterStartupScript(Page, typeof(Page), Guid.NewGuid(), scriptBlock, true); 

,或者你喜欢的一些其他的方法来生成唯一键。