2009-10-30 5 views
3

J'écris une partie Web ASP.NET à utiliser dans un site SharePoint et j'essaie d'utiliser un UpdatePanel pour afficher les résultats de la requête. Je veux utiliser un plugin JQuery pour modifier la table retournée par la publication asynchrone, mais j'ai du mal à faire exécuter le script de démarrage sur l'udpate asynchrone. J'ai trouvé cet article avec indicates that the UpdatePanel won't do an eval() on startup scripts; instead, you must register the startup script block with the ScriptManager. Tout a un sens jusqu'à ce que ça ne marche pas. Le MSDN reference documentation seems to concur avec l'approche prise là.Le script de démarrage de UpdatePanel ne s'exécute pas

Mon contrôle est trop long à publier complètement, mais voici une représentation réduite qui couvre tout ce qui est pertinent. Pardonnez-moi s'il y a des contrôles manquants dans la pâte ci-dessous - j'ai dû enlever quelques parties, et il peut y avoir quelques tentacules pendantes, pour ainsi dire. Ci-dessous est le code pour le webpart, qui n'est pas différent de SmartPart qui charge un contrôle utilisateur (.ascx).

Comme vous pouvez le voir, j'utilise la méthode ScriptManager.RegisterStartupScript. J'ai essayé les deux surcharges; une fois pour la page, et une fois pour le ListView (renommé comme 'AspListView') qui est dans le panneau de mise à jour. Dans les deux cas, le script de démarrage ne s'exécute pas sur la mise à jour asynchrone, et je ne sais pas pourquoi.

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

Et le contrôle de l'utilisateur qui est chargé:

<%@ 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

Lorsque vous regardez la source de la page rendue, le javascript est-il quelque part? Cela pourrait donner quelques indices ... – codeulike

+0

après avoir joué avec un peu, je l'ai eu à travailler. Je pense que le problème était que j'utilisais justement quicksearch() d'une manière ou d'une autre. J'ai essayé plus tard avec une simple alerte() et cela a bien fonctionné. –

Répondre

0

après avoir joué avec un peu, je l'ai eu à travailler. Je pense que le problème était que j'utilisais justement quicksearch() d'une manière ou d'une autre. J'ai essayé plus tard avec une simple alerte() et cela a bien fonctionné. Merci pour les suggestions!

3

Au lieu d'utiliser ScriptManager.RegisterStartupScript est ici quelque chose d'autre que vous pourriez essayer. Inscrivez-vous pour l'événement end_request du UpdatePanel et exécuter votre script 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

Je voudrais ajouter que les startupscripts UpdatePanel ne fonctionneraient pas pour nous à moins que vous avez utilisé le UpdatePanel's ID et typeof(UpdatePanel). Utiliser startupscripts ailleurs en dehors d'un updatepanel n'était pas aussi difficile. Nous sommes ce travail comme celui-ci:

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

La solution présentée par Darin fonctionnerait aussi bien, mais dans notre cas, le UpdatePanel a plus de fonctionnalités et nécessiterait une logique supplémentaire pour « suivre » ce qui était fait le script wouldn Ne pas exécuter sur chaque mise à jour du panneau de mise à jour, mais seulement après un certain événement. De cette façon, le script n'est exécuté que sur cet événement.

+0

OMG tu me as sauvé !! –

+0

J'ai essayé tant de solutions différentes avant celui-ci et aucun de ceux travaillé. Celui-ci fonctionne parfaitement bien depuis mon contrôle utilisateur –

1

ScriptManager.RegisterStartupScript prend un paramètre clé , que vous définissez à UniqueID du contrôle. Cette clé doit être unique lors de l'exécution des scripts de page. Donc, vous devez modifier cette ligne:

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

avec

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

ou d'une autre manière que vous le souhaitez pour générer des clés uniques.

Questions connexes