2

我有几个 HTML 表，我正在使用 jQuery 将行从一个 html 表移动/随机排列到另一个。洗牌完成后，我需要找到一种方法将这些表保存在服务器端（最好在 Session 中），以便可以在下一页检索它们。

作为第一步，我尝试将更改后的 DOM 保存在 ASP.NET 文本框中，以便我可以将整个 html 带到 ASP.NET 端（然后使用 VB.NET 代码处理它以保存在会话/缓存中）。

var html = $('html').clone();
var htmlString = html.html();

$('#TextBox1').val(htmlString);

但我被困在我收到以下错误的第一步

“从客户端检测到潜在危险Request.Form值TextBox1 ...”

请有人指导我如何将这些 HTML 表保存在服务器端，以便我可以使用 ASP.NET 来读取和处理它们？我应该寻找 JSON 吗？

4

4 回答 4

2

如果您的目标是将表的数据发布到服务器，我通常将表的行转换为对象，并通过 ajax() 将数据作为 JSON 发布。您可以添加一个单击事件以在用户按下将触发回发或任何其他事件的按钮时自动触发此事件。

例子：

客户端

    // Wire up posting the data to the server with a ASP.NET button
    $('#<%= Save.ClientID %>').click(function (e) {
        PostTable();
    });


    // Read a row
    function GetRow(rowNum) {
        var tableRow = $('#partTable tbody tr').eq(rowNum);

        var row = {};

        row.ChangeType = tableRow.find('td:eq(1)').text();
        row.UpdateType = tableRow.find('td:eq(2)').text();
        row.Part = tableRow.find('td:eq(5)').text();
        row.Price = tableRow.find('td:eq(7)').text();
        row.UOM = tableRow.find('td:eq(8)').text();
        row.ApplyDate = tableRow.find('td:eq(9)').text();
        row.Remarks = tableRow.find('td:eq(10)').text();

        return row;
    }

    // Read all rows
    function GetAllRows() {
        var dataRows = [];

        $('#partTable tbody tr').each(function (index, value) {
            var currentRow = GetRow(index);
            dataRows.push(currentRow);
        });

        return dataRows;
    }

    // POST rows to server
    function PostTable() {
        var crossId = getParameterByName('id');
        var jsonRequest = { rows: GetAllRows(), crossId: crossId };

        $.ajax({
            type: 'POST',
            url: 'TableProcessingViajQueryAjax.aspx/SaveRows',
            data: JSON.stringify(jsonRequest),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            async: false,
            success: function (data, text) {
                return true;
            },
            error:function (request, status, error){
                return false;
            }

服务器端

    [WebMethod]
    public static bool SaveRows(List<Row> rows, int crossId)
    {
        // Do something with your data, maybe put in session/cache/db/etc...
    }

服务器端（对象必须匹配在 JS 中创建的对象）

public class Row
{
    public string ChangeType { get; set; }
    public string UpdateType { get; set; }
    public string Part { get; set; }
    public double Price { get; set; }
    public int UOM { get; set; }
    public DateTime ApplyDate { get; set; }
    public string Remarks { get; set; }
}

** 我正在使用 JSON.ORG 的“stringify”将我的对象转换为有效的 JSON 对象。

于 2012-07-24T15:13:20.667 回答
1

在不禁用请​​求验证的情况下解决此问题的一种方法是将 HTML 数据编码为 ASP.NET 不会检测为潜在危险请求的内容。这样的选项是base64编码。

由于您已经在使用 jquery；您可以使用众多 base64 插件之一轻松获取 html 并对其进行编码（此处为一个示例）。

现在你需要做的就是：

$('#TextBox1').val(base64encodedhtmlString);

并将其转换回服务器端，如下所示：

string encodedstring = ASCIIEncoding.UTF8.GetString(Convert.FromBase64String(text.Text));

假设您的页面使用 utf-8 编码，如：<meta charset="utf-8">.

注意：这个“解决方案”是一个 hack。我会寻找一种替代方法来做你需要做的事情而不做这样的事情。它闻起来臭臭的。

更新：

为您添加一个jsfiddle。请注意“管理资源”部分。我正在使用上面链接的插件。

您可以从我的示例 ( PHRhYmxlIGlkPSJzb21ldGFibGUiIGNlbGxwYWRkaW5nPSI1IiBib3JkZXI9IjIiPgogIDx0Ym9keT48dHI+CiAgICAgPHRkPmJsYWg8L3RkPgogICAgIDx0ZD5ibGFoPC90ZD4KICAgICA8dGQ+YmxhaDwvdGQ+CiAgIDwvdHI+CjwvdGJvZHk+PC90YWJsZT4=) 中获取输出并在此处对其进行解码，以验证它实际上包含原始 html。

于 2012-07-24T14:38:58.737 回答
0

您可以遵循以下解决方案：

<%@ Page Language="C#" ValidateRequest="false" %>

但是验证请求检查潜在危险的请求你也可以阅读这个。

于 2012-07-24T14:03:03.897 回答
0

您是否尝试过使用 HiddenField 而不是 TextBox？我不记得您是否使用 HiddenField 获得“潜在危险的 Request.Form 值”。我想它可能仍然存在。

无论如何，我会尝试使用 JSON 而不是尝试发送 HTML 表的代码（这在服务器端会更难解析）。您可以使用 jQuery 来操作您的数据并保存在 javascript 变量（对象数组？）中，而不是直接修改 HTML 表格；然后根据这些变量重建您的 HTML 表格显示。

您可以将客户端上的数据序列化为 JSON (JSON.stringify) 并将其发送到 HiddenField 中的服务器。然后在服务器上，您可以使用 JavaScriptSerializer 对其进行反序列化并在服务器上处理该数据。在另一个页面上，您可以创建另一个 HiddenField 并使用 JavaScriptSerializer 将您的数据序列化到 HiddenField；然后您的客户端代码可以反序列化 JSON 以将数据加载到变量中并使用这些变量重建 HTML 表格显示。

JSON2 示例...

// Serialize
var value_for_hidden_field = JSON.stringify(my_js_variable);  
$("#HiddenField1").val(value_for_hidden_field); 

// Deserialize
var my_js_variable = JSON.parse($("#HiddenField1").val());

ASP.Net 示例...
这过于简化了，因为您需要使用已设置的类来处理数据，但它可以让您大致了解要调用的方法。

' Deserialize
Dim jss As New System.Web.Script.Serialization.JavaScriptSerializer
Dim json_x  = jss.Deserialize(Of YourClassName)(HiddenField1.Value)

' Serialize
Dim jss As New System.Web.Script.Serialization.JavaScriptSerializer
Dim json_x As New YourClassName = GetYourData() ' Returning appropriate object
HiddenField1.Value = jss.Serialize(json_x)
于 2012-07-24T14:11:16.367 回答