Question

我正在尝试使用HTML表单并序列化字段，以便它可以作为属性存储在JavaScript中的元素中（您可以使用jQuery）。稍后可以在C＃中解析它并转换为.NET类型。这必须适用于任何类型，因为表单是通过对服务器的Ajax调用生成的。

例如，给出以下形式：

<form>
    <input type="text" name="Assembly" value="MyAssembly.dll" />
    <input type="text" name="Class" value="MyClass" />
    <input type="text" name="Parameters.Parameter1" value="5" />
    <input type="text" name="Parameters.Parameter2" value="10" />
</form>

它会产生类似的东西：

<widget assembly="MyAssembly.dll" class="MyClass" parameters="???"></widget>

注意：???将替换为JSON或XML（取决于您认为最好的）。

现在说我将这个字符串存储在数据库中，我需要在服务器上解析它以将其转换为.NET类型。我可以做一个正则表达式来获得适当的属性，让我留下以下变量：

var assembly = "MyAssembly.dll";
var @class = "MyClass";
var parameters = "???";

现在最后我需要将其序列化为.NET类型。

如果有人可以提供帮助，我会很感激。感谢

Answer 1

我想出了一些有用的东西。我的解决方案稍微复杂一点，但我会尝试发布关键位，以防有人感兴趣。

首先我创建了以下插件：

$.fn.serializeObject = function(prefix) {
    var o = {};

    // Serialize the form as an array
    var a = this.serializeArray()
        .filter($.proxy(function(element) {
            // Make sure the prefix matches and it is not a checkbox (this is needed since ASP.NET MVC renders a hidden checkbox for the false value)
            return element.name.indexOf(prefix || '') == 0 && $('[name=\'' + element.name + '\'][type=\'checkbox\']', this).length == 0;
        }, this));

    // Now append the checkbox values (this makes sure we only have one element in the array with the correct value whether it is selected or not)
    a = a.concat($('input[type=\'checkbox\']', this).map(function() {
            return { 'name': this.name, 'value': $(this).is(':checked') ? 'true' : 'false' }
        }).get());

    $.each(a, function() {
        var n = this.name.substr((prefix || '').length);

        if (o[n] !== undefined) {
            if (!o[n].push)
                o[n] = [o[n]];

            o[n].push(this.value || '');
        } else
            o[n] = this.value || '';
    });

    return o;
};

现在我的应用程序实际上有一个WYSIWYG插件，它在编辑器中嵌入我的自定义小部件标记。下面是一个示例，说明在提交表单时可以从表单创建窗口小部件标记（然后将其存储在数据库中）：

$('form').submit(function(e) {
   var parameters = JSON.stringify($('form').serializeObject('Parameters.'));
   var widget = '<widget assembly="' + $('[name=\'Assembly\']').val() + '" class="' + $('[name=\'Class\']').val() + '" parameters="' + parameters + '"></widget>';
   ...
});

最后在服务器上，您需要通过执行以下操作来替换显示的小部件：

output = Regex.Replace(output, @"<widget assembly=""(.*?)"" class=""(.*?)"" parameters=""(.*?)""></widget>", m => ReplaceWidget(m, helper));

这是ReplaceWidget方法：

private static string ReplaceWidget(Match match, HtmlHelper helper) {
    var assembly = match.Groups[1].Value;
    var @class = match.Groups[2].Value;
    var serializedParameters = match.Groups[3].Value;

    // Get the type
    var type = Assembly.LoadFrom(HttpContext.Current.Server.MapPath("~/bin/" + assembly)).GetType(@class);

    // Deserialize the parameters
    var parameters = JsonConvert.DeserializeObject(HttpUtility.HtmlDecode(serializedParameters), type);

    // Return the widget
    return helper.Action("Widget", "Widgets", new { parameters = parameters }).ToString();
}

希望这有帮助。

在JavaScript中序列化HTML表单，然后在C＃中转换为.NET类型

1 个答案: