Question

刚开始使用AJAX并在microsoft 70515书中尝试了一个简单的例子。但是，代码似乎不起作用，我无法弄清楚为什么不 - 因为它似乎没问题。

编辑：由于某种原因，部分代码没有发布，（即使我现在写这个代码看起来很奇怪，就像我不能发布我的所有代码？）我已经修复了现在 - 但是投票结果怎么样？我真的不明白我的问题是什么愚蠢的。请解释一下。

希望有人能发现问题并在这里帮助我：）

Markup .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

您的代码非常接近，但问题在于您尝试从客户端访问ServerSide对象（例如Label和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）函数，它是document.getElementById（）的简写 - 它们是可互换的，并且完全相同。您需要在JavaScript中将引号中的ClientID传递给这些方法中的任何一个，并且它将返回对您尝试访问的对象的引用。

为了好玩，我修改了一个后端功能，以便您知道在服务器上处理了回调：

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

瞧！这对我有用 -

Screenshot of Ajax callback result

我希望它也适合你，我希望问题在哪里清楚;你的大多数例子都是完美的工作/设置。

无法使AJAX代码工作

2 个答案: