Javascript C#MVC Post模型和从js发送到控制器的附加数据

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

[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) {
        }});

---

您需要构建对象，分配属性（确保它与任何模型验证匹配，字段名称与您的模型相同），并使用

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

您的post方法如下所示：

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

您的javascript帖子如下所示：

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

---

希望有帮助

获取模型中所有字段的最快、最简单的方法是序列化与模型绑定的表单

更新 在属性中接收null的问题是因为

serializeArray（）

create key-value-format json。您只需要将json从键值重新构建为可以映射到模型的属性值

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

在ajax调用中稍作调整，而不是使用

contentType

。这是在控制器的模型对象参数中获取null的另一个原因

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

---

下面是我如何让它工作的。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。

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

您可以使用ajax调用ProcessWorkflowActionYes，但是，我如何将模型打包成一个json对象，并对其进行任何数据更改？您只是在问如何在js中创建一个对象，并将其作为

model

发送给您的控制器吗？是的，我更新了这个问题，希望在我试图实现的内容中更具体一点。var model={your data}var data={'model'：模型，'stepActionId'：1，'stepNumber'：1}然后将数据传递到ajax callI中，我会尝试一下，然后再告诉您它是如何工作的。我的模型相当大，因为系统正在收集大量数据点。因此，我将编写一段js，从inputs name属性创建模型，这样它将自动处理新字段的删除或添加。因此，当我这样做时，我会我的模型的et null。我使用了$（'frm'）.serializeArray（）获取模型中的所有值。它拥有所有值，但我仍然得到null。还有什么想法吗？您的模型是否有默认/空的构造函数？还有，您的json发送时是什么样子的？我的模型只有默认构造函数。我验证了json具有我期望的所有参数，没有其他任何参数。@Nate-是，但取决于关于json的格式…例如，它是否以

model:[

开头，这将影响WebAPI方法如何解释它。好的，我这样做了，我在控制器上为我的模型设置了null。当我调试js时，看起来所有字段都正确。我还尝试添加了json.Stringify（modelObj）看看这个模型是否会填充模型。你有任何想法吗？你能发布你的视图的样本吗？在这个过程中。代码是我正在使用的。@ NATE我已经更新了答案。试试这个。这是可行的，没有其他的改变。我已经通过快速的PoC检查了我的答案。用我的解决方案。不需要将类型化模型更改为字符串。