如何糾正ASP.NET webform jquery引用在部分回發中丟失

在asp.net webform中，我有一些控制頁面元素定位的jQuery。由於這是一個web窗體，並且這些控件中的一些與服務器對話以使jquery工作，所以我將控件嵌套在AJAX UpdatePanel中以防止回發重置我的控件。如何糾正ASP.NET webform jquery引用在部分回發中丟失

ASPX：

<asp:UpdatePanel ID="searchupdatePanel" runat="server" UpdateMode="Conditional"> 
    <ContentTemplate> 
     <div id="searchholder" > 
      <div id="searchoptions"> 
       <a href="#" id="btnClose">Close</a> <a href="#" id="btnAdvanceSearch">Advanced Search</a> 
       <br /> 
       <a href="#" id="btnFilters">Filters</a> 
      </div> 
      <div id="search" class="searchcontainer"> 
       <asp:TextBox ID="tbsearchterm" CssClass="watermark" runat="server" OnTextChanged="tbsearchterm_TextChanged" /> 
       <div class="buttons"> 
        <asp:LinkButton runat="server" Text="Search" class="button search-big" ID="btnSearch" OnClick="btnSearch_Click" /> 
        <asp:LinkButton runat="server" Text="Fx" class="button left big" ID="btnOperators" /> 
        <asp:LinkButton runat="server" Text="Save" class="button right big" ID="btnSave" /> 
       </div> 
      </div> 
      <div id="divAdvSearch"> 
      </div> 
     </div> 
    </ContentTemplate> 
</asp:UpdatePanel> 

<div id="divBody"> 
    <asp:UpdatePanel runat="server" UpdateMode="Always"> 
     <ContentTemplate> 
      <div id="divSearchResults" visible="true" runat="server"> 
       <uc:SearchResultsControl ID="SearchResultsControl" runat="server"></uc:SearchResultsControl> 
      </div> 
     </ContentTemplate> 
    </asp:UpdatePanel>

當搜索按鈕被點擊我修改CSS類用於搜索控制重新定位我的搜索DIV層是更新面板「searchudpatepanel」

searchcontrol .js

$(function() { 
    $("#searchupdatePanel").addClass("searchmenubar"); 
    $("#btnClose").hide(); 
}); 

$(function() { 
    $("#btnSearch").click(function() { 
     $(".searchmenubar").animate({ "margin-top": "5px" }, "fast"); 
     $("#btnAdvanceSearch").show(); 
     $("#btnFilters").show(); 
     $("#btnClose").hide(); 
     $("#divAdvSearch").hide(); 
     alert("search"); 
    }); 
});

該按鈕也點擊調用服務器端代碼來檢索並填充名爲SearchResultsControl（第二個更新面板）的用戶控件中的結果

我感到困惑的是，當searchResult控件加載結果時，所有對jquery類的引用都丟失了。結果，每個被隱藏的div元素或被點擊的按鈕點擊都停止工作。在調試過程中，我可以看到何時調用用戶控件爲第二次調用default.aspx文件的Page_Load。我假設這部分負載是對js文件的引用，我只是不知道如何解決這個問題。

我試着用IsStartupScriptRegistered看到頁面加載內的測試，如果JS是越來越稱爲

string csname = "PopupScript"; 
Type cstype = this.GetType(); 

ClientScriptManager cs = Page.ClientScript; 

if (!cs.IsStartupScriptRegistered(cstype, csname)) 
{ 
    StringBuilder cstext1 = new StringBuilder(); 
    cstext1.Append("<script type=text/javascript> alert('Hello World!') </"); 
    cstext1.Append("script>"); 
    cs.RegisterStartupScript(cstype, csname, cstext1.ToString()); 
}

這裏在頁面初始化我會看的時候UserControl加載我彈出然而發生會在頁面加載中第二次通過，但從未顯示警報（我假設這是由於部分加載，因此瀏覽器認爲腳本已經註冊）。

我能想到的唯一的其他事情是我重寫正在加載的自定義結果集的UserControl正在加載的呈現。

protected override void Render(HtmlTextWriter htw) 
{ 
    if (IsPostBack) 
    { 
     QueryResponse qr = iu.GetSearchResults(SearchTerm); 
     int num = qr.TotalMatchesReturned; 

     SearchData sd = new SearchData(); 
     htw.Write("<table style='width: 100%; height:100%'><tr ><td style='width: 50%'>"); 
     htw.Write("<div id='divResultDetail' runat=server >"); 
     htw.Write("<script type='text/javascript' src='../js/paging.js'></script><div id='pageNavPosition'></div><table id='results'>"); 

     for (int i = 0; i < num; i++) 
     { 
      ...edited for brevity.

任何建議或指導，爲什麼我失去了參考jQuery的功能？我沒有使用母版頁，所以我沒有使用ASP ScriptManager。

在使用UpdatePanel之前，這一切都工作正常。我將「精細」定義爲：回發是每次重新加載/註冊js文件，所以它們被重置（這沒關係）。但是，現在需要進行一些其他更改，我需要考慮利用UpdatePanel s。

感謝您的任何建議或想法。

來源

2011-11-02 rlcrews

可以使用live或delegate jQuery方法讓你的處理程序綁定到添加到頁面上的任何元素。

或者，如果除了原始頁面加載之外，每次部分回發之後都需要進行一些設置，您可以將其設置爲pageLoad方法而不是document.ready。 ASP.NET在頁面加載時以及每次部分回發之後調用此函數。

function pageLoad() 
{ 
    // Setup code here 
}

檢查這篇文章更多： http://encosia.com/document-ready-and-pageload-are-not-the-same/

來源

2011-11-02 22:53:39 Meligy

感謝文章Mohamed，它解釋了jquery的一些調整之後發生了什麼，我能夠得到這個工作。 – rlcrews

您需要使用delegate來點擊按鈕。它將確保現在和未來的所有元素都將綁定到事件處理程序。

http://api.jquery.com/delegate/

$("body").delegate("#btnSearch", "click", function() { 
    $(".searchmenubar").animate({ "margin-top": "5px" }, "fast"); 
    $("#btnAdvanceSearch").show(); 
    $("#btnFilters").show(); 
    $("#btnClose").hide(); 
    $("#divAdvSearch").hide(); 
    alert("search"); 
});

來源

2011-11-02 22:05:28 Sam

Sam我想在初始加載時隱藏元素。例如我有一個div層ID「富」，並在頁面初始化我想設置其值隱藏。我如何在點擊事件之外做到這一點？ – rlcrews

你需要掛接到'Sys.Webforms.PageRequestManager'' endRequest'事件。參見Agamand True的回答在我的上面。 – Sam

您需要重新綁定時更新面板完成更新的元素。像這樣，

var prm = Sys.WebForms.PageRequestManager.getInstance(); 

    prm.add_endRequest(function() { 
     $('#add').click(function() {    
     }); 

     $('#addPrevious').click(function() {    
     }); 
    });

希望這會有所幫助。

來源

2011-11-03 06:46:58

如何糾正ASP.NET webform jquery引用在部分回發中丟失

回答

相關問題