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控制器的调用：

[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 。这是一个安全的红旗。

endBackgroundTask

建议： 使用参数化查询。

第二

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

建议： 使用Ajax POST 。

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);

UX设计

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

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

建议： 不是真正的建议;这只是个人偏好，所以不要误会我的意思。我个人喜欢像附加的StackOver屏幕截图一样更新一大块控件 -

Answer 2

尝试在JS代码中定义一组条件，以便在列定义需要时使用多个控制器，如下所示：

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

        var id = $(this).attr("id");
        var column = $(this).attr("class");
        var value = $(this).val();
        var controler = "UpdateTable";
        if(column=='Delete'){
           controler = "DeleteTable";
        }
        if(column=='Mail'){
           controler = "SendMail";
        }
        if (typeof id !== "undefined" && typeof column !== "undefined" && typeof value !== "undefined") {

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

    });

Answer 3

使用实体框架，您可以使用更简洁的代码轻松更新表格。

result = []
table.search('tr').map do |row|
  row.search('td').each do |td|

    result.push(row.search('td')[0].text.to_s)

 end
end

puts result

Answer 4

我能想到的主要是，为什么不使用'改变'而不是'聚焦'？即使值没有改变，Focusout也会运行你的代码，你需要吗？

另一件事：

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

可以改进为：

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

完成后，带有输入的ASP.NET jQuery Ajax表保存

4 个答案:

第一

第二

UX设计