2009-12-23 67 views
10

我遇到了從UpdatePanel內部的外部javascript文件運行javascript的問題。我試圖讓一個顏色選擇器在ListView中工作。 ListView位於UpdatePanel中。我正在使用this color pickerASP.Net - AJAX中的Javascript UpdatePanel

以下是我已經把範圍縮小到:

  • 如果我使用顏色選擇上UpdatePanel之外的文本框,它通過所有回傳工作完全正常。

  • 如果我在UpdatePanel的文本框中使用顏色選擇器,它會工作,直到我做異步回發(單擊ListView中的「編輯」按鈕)。一旦UpdatePanel完成回發,文本框將不再顯示單擊時的顏色選擇器。當文本框位於ListView的InsertItemTemplateEditItemTemplate中時,也會發生同樣的情況。

如果你想複製它,只需下載顏色選擇器(它是免費的),然後加入這一個網頁...

<asp:ScriptManager ID="ScriptManager1" runat="server"> 
</asp:ScriptManager> 

<div> 
    <asp:UpdatePanel ID="panel1" runat="server"> 
     <ContentTemplate> 
      <asp:TextBox runat="server" ID="textbox" CssClass="color" /> 
      <asp:Button ID="Button1" runat="server" Text="Button" /> 
     </ContentTemplate> 
    </asp:UpdatePanel> 
</div> 

頁面加載時,拾色器作品精細。當你點擊該按鈕(進行回發)時,顏色選擇器將不再工作。

任何想法?

回答

15

異步往返之後,任何啓動腳本都將不會運行,這可能是爲什麼它在AJAX回調之後不起作用。顏色選擇器可能具有需要在頁面加載時執行的功能。

我碰到這麼多次,我寫了一個小的方法來註冊我的腳本在代碼後臺,它處理異步和非異步往返。這裏的基本輪廓:

private void RegisterClientStartupScript(string scriptKey, string scriptText) 
{ 
    ScriptManager sManager = ScriptManager.GetCurrent(this.Page); 

    if (sManager != null && sManager.IsInAsyncPostBack) 
    { 
     //if a MS AJAX request, use the Scriptmanager class 
     ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), scriptKey, scriptText, true); 
    } 
    else 
    { 
     //if a standard postback, use the standard ClientScript method 
     scriptText = string.Concat("Sys.Application.add_load(function(){", scriptText, "});"); 
     this.Page.ClientScript.RegisterStartupScript(this.Page.GetType(), scriptKey, scriptText, true); 
    } 
} 

其實我烤到上述基頁類,這樣我工作的任何頁面可以調用this.RegisterClientStartupScript(...)。要做到這一點,只需創建一個基本頁面類並將其包含在其中(確保將受保護的頁面標記爲非私人頁面或繼承頁面類將無法訪問它)。

通過上面的代碼,我可以放心地註冊客戶端腳本,而不管頁面是做回發還是回調。意識到您正在使用外部腳本文件,您可能可以修改上述方法來註冊外部腳本而不是內聯腳本。有關更多詳細信息,請參閱ScriptManager類,因爲有幾種腳本註冊方法...

+0

謝謝。我使用了這個方法,並將'jscolor.init()'方法稱爲'scriptText',現在它可以工作。 – 2009-12-23 15:12:57

+0

沒問題:)很高興它解決了這個問題。 – 2009-12-23 15:57:09

+0

我比較喜歡創建基頁類的擴展方法,而不是頁面類。非常感謝。 +1 – IsmailS 2010-05-12 10:30:18

0

我猜測運行設置顏色選擇器的jscolor.js代碼只在頁面第一次加載時才被調用,所以當控件在服務器上重新生成時,會丟失jscolor所做的更改。你可以註冊一些javascript在你的代碼後面調用,這樣當你的異步調用完成時它會調用jscolor上的init方法嗎?

1

您是否試過ScriptManager.RegisterStartupScript,它允許您「在執行異步回發時從服務器向頁面添加JavaScript」?

2

看jscolor源代碼後,我注意到,它初始化窗口上負載的一切。所以,你可能需要重新初始化像這樣的東西(的UpdatePanel內):

function yourInit(){ 
    /* keep in mind that the jscolor.js file has no way to determine 
     that the script has already been initialized, and you may end 
     up initializing it twice, unless you remove jscolor.install(); 
    */ 

    if (typeof(jscolor) !== 'undefined'){ 
     jscolor.init(); 
    } 
} 
if (typeof(Sys) !== 'undefined'){ 
    Sys.UI.DomEvent.addHandler(window, "load", yourInit); 
} 
else{ 
    // no ASP.NET AJAX, use your favorite event 
    // attachment method here 
} 

如果你決定把jscolor腳本的UpdatePanel內,你也需要這樣添加的東西到在jscolor.js的結尾:

if(Sys && Sys.Application){ 
    Sys.Application.notifyScriptLoaded(); 
} 
+0

「if(window.Sys ...」,not「if(Sys ...」 – thorn 2010-01-06 18:10:25