C#MVC Post Model和从js到控制器的附加数据

本文关键字：数据 控制器 Post Model 和从 js C#MVC | 更新日期: 2023-09-27 18:27:24

我正在使用我正在创建的自定义工作流解决方案。我想创建一个具有模型和两个整数值的回发，这些整数值表示我已经完成的操作和步骤。我不想把它们添加到模型中，因为它们只在这一个地方使用。此回发的签名应该是这样的。

[HttpPost]
public void ProcessWorkflowAction(EditScreenModelValidation model, int stepActionId, int stepNumber)
{
    //Some work on model and actions
}

我真的很想通过JS来做这件事，因为这就是我目前获得StepActionId和StepId的方式。有没有一种方法可以打包模型通过JS发送？

 var modelObj = CreateModelData();
 var postObj = JSON.stringify(modelObj);
 $.ajax({
        type: "POST",
        traditional: true,
        dataType: "json",
        url: "url",
        data: { model: modelObj, stepActionId: stepId, stepNumber: 3 }
        cache: false,
        complete: function (data) {
        }});
CreateModelData = function () {
    var modelObj = {};
    var modelArray = $('#frm').serializeArray()
    $.each(modelArray, function (index, value) {
        assign(modelObj, value.name, value.value);
    })
    return modelObj;
};
function assign(obj, prop, value) {
    if (prop != undefined) {
        if (typeof prop === "string")
            prop = prop.split(".");
        if (prop.length > 1) {
            var e = prop.shift();
            assign(obj[e] =
                     Object.prototype.toString.call(obj[e]) === "[object Object]"
                     ? obj[e]
                     : {},
                   prop,
                   value);
        } else
            obj[prop[0]] = value;
    }
}

该模型在控制器中返回为null。我还尝试了以下代码，得到了相同的结果。

$.ajax({
        type: "POST",
        traditional: true,
        dataType: "json",
        url: "url",
        data: { model: $('#frm').serializeArray(), stepActionId: stepId, stepNumber: 3 }
        cache: false,
        complete: function (data) {
        }});

C#MVC Post Model和从js到控制器的附加数据

您需要构建对象，分配属性（确保它与任何模型验证匹配，并且字段名称与您的模型相同），然后使用JSON.stringify进行转换：

 var modelObj = {};
 modelObj.prop1 = $('#txtField1').val();
 modelObj.prop2 = $('#txtField2').val();
 // etc... make sure the properties of this model match EditScreenModelValidation
 var postObj = JSON.stringify(modelObj); // convert object to json
 $.ajax({
    type: "POST",
    traditional: true,
    dataType: "json",
    url: "/Workflow/Home/ProcessWorkflowAction",
    data: { model: postObj, stepActionId: stepId, stepNumber: 3 }
    cache: false,
    complete: function (data) {
        if (data.responseText.length > 0) {
            var values = $.parseJSON(data.responseText)
            $('#ActionErrors').html(values.message)
        }
        else {
            location.reload();
        }
    }});

这是可能的，而且很容易做到。MVC很好地打包你发送的内容。

所以，如果你的模型看起来像：

public class TestModel
{
    public string Name { get; set; }
    public int Age { get; set; }
}

你的发帖方式看起来像：

[HttpPost]
public void TestMethod(TestModel model, int num1, int num2)
{
    // Stuff
}

您的javascript POST看起来像：

function doPost(){
    $.post("/Home/TestMethod",
    {
        model: {
            Name: "Joe",
            Age: 29
        },
        num1 : 5,
        num2 : 10
     },
     function (data, status) {
         //Handle status if you decide to return something
     });
}

希望能有所帮助！

下面是我如何让它工作的。CreateModelData使用（frm）.serializeArray（）方法，但我发现如果该项在页面上被禁用或不在页面上，那么它就不会创建该属性。

    var modelObj = CreateModelData();
    var postObj = JSON.stringify(modelObj);
    $.ajax({
        type: "POST",
        traditional: true,
        dataType: "json",
        url: "url",
        data: { modelString: postObj, stepActionId: stepId, stepNumber: 3 },
        cache: false,
        complete: function (data) {
        }});
});
CreateModelData = function () {
    var modelObj = {};
    var modelArray = $('#frm').serializeArray();
    $.each(modelArray, function (index, value) {
        assign(modelObj, value.name, value.value);
    })
    return modelObj;
};
function assign(obj, prop, value) {
    if (prop != undefined) {
        if (typeof prop === "string")
            prop = prop.split(".");
        if (prop.length > 1) {
            var e = prop.shift();
            assign(obj[e] =
                     Object.prototype.toString.call(obj[e]) === "[object Object]"
                     ? obj[e]
                     : {},
                   prop,
                   value);
        } else
            obj[prop[0]] = value;
    }
}

在控制器方面，我将签名更改为所有字符串值，如下所示

[HttpPost]
public void ProcessWorkflow(string modelString, int stepActionId, int stepNumber)
{
}

为了使modelString值成为实际的模型对象，我这样做了。

using (Stream s = GenerateStreamFromString(json))
{
    DataContractJsonSerializer serializer = new DataContractJsonSerializer(typeof(modelObj));
    return (modelObj)serializer.ReadObject(s);
}

最后，这对我起到了作用。所有的字段都在那里，我没有出错。当我试图让控制器方法中的第一个变量成为模型对象时，无论我做什么，它总是为null。

获取Model中所有字段的最快、最简单的方法是序列化与Model绑定的Form。

更新

您在属性中收到null的问题是因为serializeArray()创建键值格式json。您只需要重新构建json，从键值到可以映射到模型的Property值。

var modelObj = $('#formId').serializeArray()
                           .reduce(function (a, x) { a[x.name] = x.value; return a; }, {});

ajax调用中的一个小调整是使用contentType而不是datatype。这是控制器的模型对象参数为null的另一个原因。

         $.ajax({
            type: "post",
            url: "/Account/RegisterSome",
            data: { model: modelobj, id: 3 },
            contentType: 'application/json',
            cache: false,
            complete: function (data) {
            }
        });

我通过删除JSON.stringify（）并发布我的javascript对象来解决这个问题。

相关文章：