無法讓AJAX代碼起作用

Question

剛開始使用AJAX，並在Microsoft®70515書中嘗試了一個簡單示例。然而，代碼似乎沒有工作，我不明白爲什麼不 - 因爲它似乎確定。

• 編輯：由於某種原因，該代碼的一部分沒有得到公佈，（即使我寫這現在的代碼看起來怪異，這就像我不能發佈我的代碼？）我」現在已經有fixad了 - 但是投票結果如何呢？我真的不知道我的問題是什麼愚蠢的。請解釋。

希望有人能發現的問題，並幫助我在這裏:)

標記的.aspx：

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" 
    CodeBehind="Default.aspx.cs" Inherits="AjasxTest._Default" %> 

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 
</asp:Content> 

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> 

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


<br /><br /> 

<script type="text/javascript"> 
    function ClientCallbackFunction(args) { 
     window.LabelMessage.innerText = args; 
    } 
</script> 

</asp:Content> 
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="FooterContent"> 
<asp:DropDownList ID="DropDownListChoice" runat="server" OnChange="MyServerCall(DropDownListChoice.value)"> 
<asp:ListItem>Choice 1</asp:ListItem> 
<asp:ListItem>Choice 2</asp:ListItem> 
<asp:ListItem>Choice 3</asp:ListItem> 
</asp:DropDownList> 
<asp:Label ID="LabelMessage" runat="server"></asp:Label> 
</asp:Content> 

代碼隱藏：

namespace AjasxTest 
{ 
    public partial class _Default : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler 
    { 
     protected void Page_Load(object sender, EventArgs e) 
     { 
      string callbackRef = Page.ClientScript.GetCallbackEventReference(this, "args", "ClientCallbackFunction", ""); 

      string callbackScript = String.Format("function MyServerCall(args) {{{0};}}", callbackRef); 

      Page.ClientScript.RegisterClientScriptBlock(this.GetType(),"MyServerCall", callbackScript, true); 
     } 

     public string GetCallbackResult() 
     { 
      return _callbackArgs; 
     } 

     string _callbackArgs; 

     public void RaiseCallbackEvent(string eventArgument) 
     { 
      _callbackArgs = eventArgument; 
     } 
    } 
} 

Answer 1

你的JS函數被調用ClientCallbackFunction但您在DropDownList OnChange事件中將其稱爲MyServerCall。

<script type="text/javascript"> 
    function ClientCallbackFunction(args) { 
     window.LabelMessage.innerText = args; 
    } 
</script> 

...

<!-- Call correct JS function in OnChange --> 
<asp:DropDownList ID="DropDownListChoice" runat="server" OnChange="ClientCallbackFunction(DropDownListChoice.value)"> 

...

Answer 2

你的代碼是非常接近，但問題是在你試圖訪問服務器端對象（如標籤和DropDownList的事實）從客戶端。

例如，asp：Label控件在呈現給客戶端的Web瀏覽器時，實際上是一個HTML div。 Visual Studio中標籤的ID可能是「LabelMessage」，但根據頁面和控件的佈局，客戶端的ID（例如，單擊FireFox或IE中的視圖源的用戶）可以生成爲「FooterContent_LabelMessage1」或類似的東西。

ASP.net控件確實帶有一個屬性，您可以使用該屬性訪問JavaScript中生成的ID，該屬性可以通過YourControl.ClientID訪問。

我對這些代碼進行了這些更改，並且已經能夠使其工作。我還在JavaScript中添加了一些空引用檢查，以確保我們試圖引用的對象實際上存在。注意我已經在一個空白的，全新的ASP.net窗體應用程序中測試過了。

下面是默認頁（前端）更新的代碼：

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" 
    CodeBehind="Default.aspx.cs" Inherits="TheAnswer._Default" %> 

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 
</asp:Content> 
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
    <br /> 
    <br /> 
    <script type="text/javascript"> 
     function ClientCallbackFunction(args) { 
      var labelMessage = $get("<%= LabelMessage.ClientID %>"); 
      if (labelMessage) { 
       labelMessage.innerText = args; 
      } 
     } 
     function MyServerCallWrapper() { 
      var dropDown = $get("<%= DropDownListChoice.ClientID %>"); 
      if (dropDown) { 
       MyServerCall(dropDown.value); 
      } 
     } 
    </script> 
</asp:Content> 
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="FooterContent"> 
    <asp:DropDownList ID="DropDownListChoice" runat="server" onchange="javascript:MyServerCallWrapper();"> 
     <asp:ListItem>Choice 1</asp:ListItem> 
     <asp:ListItem>Choice 2</asp:ListItem> 
     <asp:ListItem>Choice 3</asp:ListItem> 
    </asp:DropDownList> 
    <asp:Label ID="LabelMessage" runat="server"></asp:Label> 
</asp:Content> 

注意$的get（）函數是一個內置在ASP.net（不JQuery的）功能是文件的簡寫。 getElementById（） - 它們是可以互換的並且執行完全相同的操作。您需要將引號中的ClientID傳遞給JavaScript中的任何一種方法，並且它會返回對您嘗試訪問的對象的引用。

只是爲了好玩，我修改的後端功能之一，所以你知道，回調是在服務器上處理：

public string GetCallbackResult() 
{ 
    return _callbackArgs + " from the server!"; 
} 

瞧！這對我的作品 -

我希望它爲你工作太多，我希望這顯然問題出在哪裏了;你的大部分例子都是完美的工作/設置。