ASP.NET jQuery Ajax调用代码隐藏方法

一尘不染

ASP.NET jQuery Ajax调用代码隐藏方法

ajax

我对Web开发非常陌生，但是总体上有很多开发经验。我有一个ASP页，其中包含一些输入字段和一个提交按钮。这个提交按钮纯粹调用$
.ajax，我打算在代码隐藏文件中调用一个方法。但是，我注意到了两个有趣的事情。首先，无论向其提供了什么数据，ajax调用都会成功。其次，responseText字段是整个页面的html源。

我已经阅读了此文章以及其他指向webconfig的文章，但是这些解决方案似乎无法解决我的问题。

这是asp页面：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script src="TesScript.js"></script>
    <link rel="Stylesheet" type="text/css" href="TestStyle.css" />
</head>
<body>
    <div>
        <ul class="tempList">
            <li>Name:
                <input id="nameText" type="text" />
            </li>
            <li>Attending:
                <input id="yesButton" type="radio" name="attending" />
                Yes
                <input id="noButton" type="radio" name="attending" />
                No </li>
            <li>Return Address:
                <input id="returnAddressText" type="text" />
            </li>
            <li>
                <input id="submitButton" type="button" onclick="submit()" value="Submit" />
            </li>
        </ul>
    </div>
    <ul id="errorContainer" class="errorSection" runat="server" />
    <ul id="messageContainer" class="messageSection" runat="server" />
</body>
</html>

后面的代码：

using System;
using System.Web.Services;
using System.Web.UI;

namespace TestAspStuff
{
    public partial class _Default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }


        [WebMethod]
        public static string OnSubmit(string name, bool isGoing, string returnAddress)
        {
            return "it worked";
        }
    }
}

和JavaScript：

function submit() {

    var name = "my name";
    var isAttending = true;
    var returnAddress = "myEmail@gmail.com";

    SendMail(name, isAttending, returnAddress);
}

function SendMail(person, isAttending, returnEmail) {

    var dataValue = { "name": person, "isGoing": isAttending, "returnAddress": returnEmail };

    $.ajax({
        type: "POST",
        url: "Default.aspx/OnSubmit",
        data: dataValue,
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
        },
        complete: function (jqXHR, status) {
            alert("complete: " + status + "\n\nResponse: " + jqXHR.responseText);
        }
    });

}

现在，我注意到我可以将url属性更改为所需的任何内容，并且永远不会调用error方法，并且状态为成功，responseText是整个html页面。我的webconfig具有所有适当的部分（包括htmlModule部分）。我正在.Net3.5中工作。我很感谢您的帮助，再次，我对此真的很陌生，因此对他人而言显而易见的对我而言很可能并不明显。而且，如果有更好的方法可以做到这一点（即从JavaScript调用asp.net代码隐藏方法），请随时发布。谢谢！！！

阅读 241

2020-07-26

共1个答案

一尘不染

首先，您可能想添加returnfalse；到JavaScript中Submit（）方法的底部（因为它是在AJAX中处理的，所以它停止了提交）。

您连接的是完成事件，而不是成功
事件，这是有很大区别的，这就是为什么调试结果与预期不符的原因。另外，我从未使签名方法与您的签名方法匹配，并且我始终提供了contentType和dataType。例如：

$.ajax({
        type: "POST",
        url: "Default.aspx/OnSubmit",
        data: dataValue,                
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
        },
        success: function (result) {
            alert("We returned: " + result);
        }
    });

2020-07-26