c# - 使用 XMLHttpRequest 的 ASP.NET AJAX 简单应用程序

标签 c# asp.net ajax xmlhttprequest

我是 ASP.NET 和 Ajax 的新手。我正在尝试实现一个无需回发即可更新 Web 表单的示例应用程序。单击时,我的应用程序使用 XMLHttpRequestModule 向其服务器发送请求,并显示通过警报窗口接收到的数据。

我认为问题可能是default.aspx.cs页面没有向其网络表单提供httpRequest.responseText。

比照。 sendRequest方法位于XMLHttpRequestModule中,用于检查与浏览器的兼容性,并使用指定的参数和方法发送请求。

非常感谢任何帮助。

默认.aspx

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="XMLHttpRuquestModule.htm"></script>
<script type="text/javascript">

    function helloToServer() {
        var params = "name=" + encodeURIComponent(document.form.name.value);
        sendRequest("Default.aspx", params, helloFromServer, "POST");
    }

    function helloFromServer() {
        if (httpRequest.readyState == 4) {
            if (httpRequest.status == 200) {
                alert("Response: " + httpRequest.responseText);
            }
        }
    }

</script>
</head>
<body>
<form name ="form" runat="server">
<input type="text" name="name" />
<input type="button" value="enter" onclick="helloToServer()" />
</form>
</body>
</html>

默认.aspx.cs

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
    String name = Request["name"];
    Response.Write(name);
    return;
}
}

XMLHttpRequestModule

<head>
<title></title>
<script type="text/javascript">
    var httpRequest = null;

    function getXMLHttpRequest() {
        if (window.ActiveXObject) {
            try {
                return new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    return new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e1) {
                    return null;
                }
            }
        } else if (window.XMLHttpRequest) {
            return new XMLHttpRequest();
        } else {
            return null;
        }
    }

    function sendRequest(url, params, callback, method) {
        httpRequest = getXMLHttpRequest();
        var httpMethod = method ? method : 'GET';
        if (httpMethod != 'GET' && httpMethod != 'POST') {
            httpMethod = 'GET';
        }
        var httpParams = (params == null || params == '') ? null : params;
        var httpUrl = url;
        if (httpMethod == 'GET' && httpParams != null) {
            httpUrl = httpUrl + "?" + httpParams;
        }
        httpRequest.open(httpMethod, httpUrl, true);
        httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        httpRequest.onreadystatechange = callback;
        httpRequest.send(httpMethod == 'POST' ? httpParams : null);
    }

</script>
</head>

最佳答案

在您的问题中,您提到了通过脚本标记包含的 XMLHttpRequestModule : <script type="text/javascript" src="XMLHttpRuquestModule.htm"></script>XMLHttpRuquestModule.htm 有拼写错误(“Ruquest”而不是“Request”),也许这导致了您的错误。

另请注意,只有在该文件中有 JavaScript 并且没有实际的 html 时,在脚本中包含 htm 文件才会起作用。

编辑:

这是引用我们在评论部分的交流。

我已经成功获得了 ASP.NET 服务器,针对与您的完全一样的 ASPX 页面运行 Ajax 代码,一切仍然正常。警报框仍然弹出正确的响应。

不同之处在于,正如最初建议的那样,我已将您的 XMLHttpRuquestModule.htm 重命名为 XMLHttpRuquestModule.js 并删除了其中的所有标记。

我正在此处复制所有代码,尝试准确粘贴然后运行它:

HTML 文件(testXhr.htm):

<html>
    <head>
    <title></title>
    <script type="text/javascript" src="XMLHttpRequestModule.js"></script>
    <script type="text/javascript">

        function helloToServer() {
            var params = "name=" + encodeURIComponent(document.form.name.value);
            sendRequest("Default.aspx", params, helloFromServer, "POST");
        }

        function helloFromServer() {
            if (httpRequest.readyState == 4) {
                if (httpRequest.status == 200) {
                    alert("Response: " + httpRequest.responseText);
                }
            }
        }

    </script>
    </head>
    <body>
        <form name ="form" runat="server">
            <input type="text" name="name" />
            <input type="button" value="enter" onclick="helloToServer()" />
        </form>
    </body>
</html>

JavaScript 文件(XMLHttpRequestModule.js):

var httpRequest = null;

function getXMLHttpRequest() {
    if (window.ActiveXObject) {
        try {
            return new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                return new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e1) {
                return null;
            }
        }
    } else if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    } else {
        return null;
    }
}

function sendRequest(url, params, callback, method) {
    httpRequest = getXMLHttpRequest();
    var httpMethod = method ? method : 'GET';
    if (httpMethod != 'GET' && httpMethod != 'POST') {
        httpMethod = 'GET';
    }
    var httpParams = (params == null || params == '') ? null : params;
    var httpUrl = url;
    if (httpMethod == 'GET' && httpParams != null) {
        httpUrl = httpUrl + "?" + httpParams;
    }
    httpRequest.open(httpMethod, httpUrl, true);
    httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    httpRequest.onreadystatechange = callback;
    httpRequest.send(httpMethod == 'POST' ? httpParams : null);
}

关于c# - 使用 XMLHttpRequest 的 ASP.NET AJAX 简单应用程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8738729/

相关文章:

c# - Trello 海牛添加附件

javascript - 在 ASP.NET 中,您可以 String.Empty 焦点所在的 TextBox 吗?

asp.net - 经过身份验证的服务不支持跨域 javascript 回调。通过 SSL 代理对 WCF 服务进行 AJAX 查询

c# - 如何使用 ASP.NET MVC 流式传输视频文件?

c# - <form>中的Asp.net core设置后台

C# WIA ADF 有下一页

c# - 错误时的 ASP MVC 和 JsonResult

c# - 为什么我的用户控件一直将其可见属性重置为 false?

c# - Gridview 选择命令字段未在更新面板中触发

jquery - Yii2 Ajax .post 从 View 的 dropdownList 到 Controller 以及接收数据时的一些操作