Jquery ajax函数已停止工作

Jquery ajax functions stopped working

本文关键字:停止工作 函数 ajax Jquery      更新时间:2023-09-26

我一直在a页面中处理一些jquery。现在突然之间,岗位职能似乎停止了工作?

 function deleteRow(OrderNo, LineNo) {
    alert(OrderNo + ";" + LineNo);
    $.ajax({
        type: "POST",
        url: "Ajax.aspx/DeleteRow",
        data: '{' + 'OrderNo:"' + OrderNo + '",' + 'LineNo:"' + LineNo + '"' +
                   '}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            //$("#item").val(msg);
            var data = jQuery.parseJSON(msg);
            if (!data.error) {
                $('#' + LineNo).remove();
            }
            else {
                alert("Error" + " " + data.error);
            }
        },
        error: function (msg) {
            alert('Failure: ' + msg);
        }
    });
}

这是一个jquery函数,它返回一个错误"Failure[object object]"

函数DeleteRow在Ajax.aspx中确实存在并且确实有效。不明白为什么岗位职能会突然停止工作??

[WebMethod]
public static string DeleteRow(string OrderNo, string LineNo)
{
    SqlConnection myConnection = new SqlConnection(connStr);
    myConnection.Open();
    //Check if param exisits
   string SQLst = "Delete from Saved_Order_Import where [Order No] = '"+OrderNo+"' And [Line No] = '"+LineNo+"'";
   try
   {
       SqlCommand myComman = new SqlCommand(SQLst, myConnection);
       myComman.ExecuteNonQuery();
   }
   catch (Exception ex)
   {
       myConnection.Close();
       return "{'"error'":'"Error Line Not Deleted" + ex.ToString() + "'"}";
   }
   myConnection.Close();
   return "{'"Success'":'"Line Deleted'"}";
}

控制台日志

abort: function ( statusText ) {
always: function () {
complete: function () {
done: function () {
error: function () {
fail: function () {
getAllResponseHeaders: function () {
getResponseHeader: function ( key ) {
isRejected: function () {
isResolved: function () {
overrideMimeType: function ( type ) {
pipe: function ( fnDone, fnFail ) {
promise: function ( obj ) {
readyState: 4
responseText:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"><title>
</title></head>
<body>
    <form name="form1" method="post" action="Ajax.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE2MTY2ODcyMjlkZAZAz479BJ9BS5KpwM0PauBgztmI" />
</div>
    <div>
    </div>
    </form>
</body>
</html>
"
setRequestHeader: function ( name, value ) {
status: 200
statusCode: function ( map ) {
statusText: "parsererror"
success: function () {
then: function ( doneCallbacks, failCallbacks ) {
__proto__: Object

您的问题在这一行:

'{' + 'OrderNo:"' + OrderNo + '",' + 'LineNo:"' + LineNo + '"' +
               '}',

应该是这样的:

'{' + '"OrderNo":"' + OrderNo + '",' + '"LineNo":"' + LineNo + '"' +
               '}',

注意在OrderNo:"之前和LineNo:"之前缺少开口"。修复程序将生成一个有效的JSON字符串:

'{"OrderNo": "OrderNo Value", "LineNo": "LineNo Value"}'

令人惊讶的是,这些双引号是有效JSON所必需的,这一点并不常见。

根据您发布的响应,服务器输出的是一个HTTP状态200,并以HTML表单作为响应。这是想要的回复格式吗?

您告诉AJAX函数将响应解析为JSON,但请求中没有返回JSON。查看控制台日志。异常是分析器错误。

您的代码有很多改进。当我第一眼悬停在你的代码上时,我会尝试至少覆盖其中一些让我感到困扰的内容。

让我担心的第一件事是,您的page方法返回一个string,您在其中手动编写一些JSON。这是你永远不应该做的事情。你永远不应手动序列化/反序列化任何东西。用任何语言。从不你可以阅读下面的文章来理解为什么。页面方法可以返回强类型对象,ASP.NET基础结构将负责将它们正确地序列化为JSON,这样您就不必担心了

public class Result
{
    public bool Success { get; set; }
    public string ErrorMessage { get; set; }
}

正如您在这个模型中看到的那样,我们有一个布尔变量指示page方法的成功或失败,还有一个字符串变量包含失败时的错误消息。

接下来,可能也是代码中最糟糕的一件事,是ADO.NET代码段中存在的SQL注入漏洞。让我们通过引入参数化查询并返回我们刚刚定义的模型来解决这个问题:

[WebMethod]
public static Result DeleteRow(string OrderNo, string LineNo)
{
    try
    {
        using (var myConnection = new SqlConnection(connStr))
        using (var myCommand = myConnection.CreateCommand())
        {
            myConnection.Open();
            myCommand.CommandText = "DELETE FROM Saved_Order_Import WHERE [Order No] = @OrderNo AND [Line No] = @LineNo";
            myCommand.Parameters.AddWithValue("@OrderNo", OrderNo);
            myCommand.Parameters.AddWithValue("@LineNo", LineNo);
            myCommand.ExecuteNonQuery();
        }
    }
    catch (Exception ex)
    {
        return new Result
        {
            Success = false,
            ErrorMessage = "Error Line Not Deleted" + ex.ToString()
        };
    }
    return new Result
    {
        Success = true
    };
}

最后一步是清理客户端代码。在这里,我建议您使用JSON.stringify方法来正确地对javascript文本进行JSON序列化,而不是使用一些字符串串联来手动构建JSON(阅读我之前在回答中链接的文章,了解为什么永远不应该手动序列化/反序列化任何东西=>您应该始终对给定的格式使用正确的qserializer)。

$.ajax({
    type: 'POST',
    url: 'Ajax.aspx/DeleteRow',
    data: JSON.stringify({ OrderNo: OrderNo, LineNo: LineNo }),
    contentType: 'application/json; charset=utf-8',
    success: function (msg) {
        // Notice how we use msg.d here. The ASP.NET Page Methods
        // infrastructure will JSON serialize the response using this property:
        // {"d":{"Success":"true"}}
        var data = msg.d;
        if (data.Success) {
            $('#' + LineNo).remove();
        }
        else {
            alert('Error ' + data.ErrorMessage);
        }
    },
    error: function (msg) {
        alert('Failure: ' + msg);
    }
});

还要确保您已经在页面的脚本管理器中启用了页面方法:

<asp:ScriptManager ID="scm" runat="server" EnablePageMethods="true" />

备注:JSON.stringify方法是本机内置的现代浏览器,但如果您需要支持传统浏览器,您可以在页面中包含json2.js脚本。

处理jQuery、Ajax和其他前端技术的PHP开发人员(像我一样):"突然不工作"可能意味着你添加了一些调试,一些"echos"(PHP错误的调试方式),但为了删除它,你忘了检查整个堆栈。你在那里发布的调试代码将花费漫长而痛苦的审查和测试。你考虑过吗?遵循以下步骤:

0-(请:开发人员从零开始计数)-只要可能,只使用URL直接调用后端,而不是使用ajax。你可以获得像QA人员使用的测试工具——我们也应该使用它们——有很多。长大去找一个。与QA人员交谈。做点什么。现在!:-)!看看您收到的内容:它是一个有效的JSON吗?它是有效的XML吗?它是一个有效的JSON/XML加上一些不应该存在的东西吗?它是一个有效的JSON/XML,但不是您期望接收的那个?也许这一步就足够了。

1-习惯以下有用的ajax片段(http://craigsworks.com/projects/forums/showthread.php?tid=3829):

$.ajax({
  url: 'http://localhost/formengine/index.php?r=site/ajax',
  success: function(response) {
    console.log(response);
  }
});

2-测试任何其他jQuery行为,而不是您正在构建的行为。这一步只是为了让你感觉更好,恢复支付薪水的日常理性。jQuery、Ajax、PHP、.net堆栈、Java堆栈:它们友好、友好,并且希望为您工作。有时,这只是处理头部内容的问题:要么是离线CDN,要么是错误的URL,要么是源位置可能错误,这些普通的日常内容。将CDN URL放在导航栏中:您将能够在浏览器屏幕中读取整个库。单击此:https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js

3-在你绝望的最深处,你有没有在不合法的地方发出警报?不要说"不"!测试一下:谷歌chrome,F12,一个开发者视角框架打开,在右上角你可以看到有史以来最小的红旗——是的:最小的。听到你脑海中的声音:点击它。一条有意义的信息就会出现。如果是这样的话,解决问题。

4-推动所有必要的努力,以制定一个明确的部署流程。复制和粘贴不是专业的方法——相信我,你是最有兴趣把事情做好的人。当然,考虑到你们使用的技术堆栈,有很多关于部署的"最佳实践"参考:遵循它们。

祝大家好运!希望它能有所帮助!