jquery - ASP.NET jQuery Ajax 表，输入完成后保存

Question

我有一个充满输入文本的表格，它们看起来像这样:

<input type='text' value='{Value}' id='{Model.ID}' class='ChckNumber' />

类名根据列的不同而不同，Model.ID 根据行的不同而不同，并且列根据列和行的不同而不同。

当输入文本失去焦点时，我调用 api 来使用用户输入的内容更新值，如下所示:

$("input[type=text]").on("focusout", function () {

        var id = $(this).attr("id");
        var column = $(this).attr("class");
        var value = $(this).val();

        if (typeof id !== "undefined" && typeof column !== "undefined" && typeof value !== "undefined") {

            $.ajax({
                url: "/api/Action/UpdateTable?id=" + id + "&column=" + column + "&value=" + value,
                type: "GET",
                error: function (request, status, error) {
                    InsertLogEntry(request.responseText + " From API Call /api/Action/UpdateTable");
                },
                success: function (data) {
                }
            });
        }

    });

这是 API Controller 的调用:

[HttpGet]
        public void UpdateTable(int id, string column, string value)
        {
            MethodClass method = new MethodClass();

            if(column != null && column != "" && id != 0)
            {
                method.UpdateTable(id, column, value);
            }
        }

这是我正在进行的方法调用:

public void UpdateTable(int id, string column, string value)
        {

            connection = new SqlConnection(connectionString);

            if(column.Contains("Date"))
            {
                DateTime dt = Convert.ToDateTime(value);

                command = new SqlCommand("UPDATE tblCheckTrackerRegister SET " + column + " = @Date WHERE ID = " + id);

                command.Parameters.Add("@Date", System.Data.SqlDbType.DateTime);

                command.Parameters["@Date"].Value = dt.Equals(DateTime.MinValue) ? (object)DBNull.Value : dt;

            }
            else
            {

                int result;

                if (int.TryParse(value, out result))
                {
                    command = new SqlCommand("UPDATE table SET " + column + " = " + value + " WHERE ID = " + id);
                }
                else
                {
                    command = new SqlCommand("UPDATE table SET " + column + " = '" + value + "' WHERE ID = " + id);
                }

            }

            command.Connection = connection;

            connection.Open();

            command.ExecuteNonQuery();

            connection.Close();

        }

这很有效，但我希望改进它。老实说，我相信一定有更好的方法来解决这个问题，因为我的代码对我来说似乎很困惑，我的问题是，任何人都可以建议另一种方法来完成我想要完成的任务吗？

Answer 1

第一

您的代码容易出现 SQL Injection attack 。这是安全方面的危险信号。

command = new SqlCommand("UPDATE tblCheckTrackerRegister SET " + column + " = @Date WHERE ID = " + id);
command = new SqlCommand("UPDATE table SET " + column + " = " + value + " WHERE ID = " + id);
command = new SqlCommand("UPDATE table SET " + column + " = '" + value + "' WHERE ID = " + id);

建议:使用参数化查询。

第二个

您正在更新记录，因此不应使用 GET 方法。它违反了基本 REST 原则 - GET 操作被认为是安全的，并且它不应该改变系统中的任何内容。

建议:使用 Ajax POST。

$.ajax({
  ...                
  type: "POST",
  ...            
});

用户体验设计

我不知道为什么每个文本框一旦失去焦点就会更新。这不是一种常见的方法。从用户的角度来看，这也不友好，因为他们没有收到有关保存更改的通知。

我们通常在 Grid 中一次更新一组控件或一次更新一行。

建议:并不是真正的建议；这只是个人喜好，所以请不要误解我的意思。我个人喜欢一次更新一大块控制权，就像附加的 StackOver 屏幕截图 -