Question

我一直在一个页面内处理一些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

Answer 1

你的问题就在这一行：

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

应该是这样的：

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

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

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

知道这些双引号是有效JSON所必需的，这一点令人惊讶。

Answer 2

可以为您的代码带来许多改进。我会尝试至少覆盖一些在第一眼看到你的代码时烦扰我的人。

让我担心的第一件事是你的页面方法返回string，你手动编写一些JSON。这是你永远不应该做的事情。你永远不应该手动序列化/反序列化任何东西。用任何语言。决不。您可以阅读following article以了解原因。页面方法可以返回强类型对象，ASP.NET基础结构将负责将它们正确地序列化为JSON，这样您就不必担心它。因此，让我们首先介绍一个您的页面方法可以返回的模型：

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

正如您在此模型中所看到的，我们有一个布尔变量指示页面方法的成功或失败，以及一个包含失败时错误消息的字符串变量。

接下来，可能是您的代码最糟糕的是，您的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方法正确JSON序列化javascript文字，而不是使用一些字符串连接来手动构建您的JSON（阅读我之前在我的答案中链接的文章，了解为什么你永远不应该手动序列化/反序列化任何东西=＆gt;你应该总是使用适当的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脚本。

Answer 3

根据您发布的响应，服务器输出是HTTP状态200，其中HTML表单作为响应。这是响应的理想格式吗？

您告诉AJAX函数将响应解析为JSON，但没有JSON从请求中返回。查看您的控制台日志。例外是解析器错误。

Answer 4

PHP开发人员（像我一样）处理jQuery，Ajax和其他前端技术：＆＃34;突然没有工作＆＃34;可能意味着你添加了一些调试，一些＆＃34; echos＆＃34; （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放在导航栏中：您应该能够在浏览器屏幕中阅读整个lib。点击此处：https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js

3 - 在绝望的最深刻时刻，你是否在某些不合法的地方发出警报？不要说＆＃34;不＆＃34;！测试它：谷歌浏览器，F12，开发人员视角框架打开，在右上角你可以看到最小的红旗 - 是的：最小的。听到你脑海中的声音：点击它。将出现一条有意义的消息。如果是这样，请解决问题。

4 - 推动所有必要的努力，以实现明确的部署流程。复制和粘贴不是专业方法 - 而且，相信我，你是最感兴趣的人。有很多＆＃34;最佳实践＆＃34;关于部署的参考，当然，考虑你们使用的技术堆栈：遵循它们。

祝你们好运！希望它有所帮助！

Jquery ajax函数停止工作

4 个答案: