如何通过ajax发布请求传递子对象

时间:2020-04-27 09:56:29

标签: javascript c# ajax asp.net-mvc

编辑:一个简化的问题

如何通过以下选项传递整数选择值:

<select data-val="true" data-val-number="The field Id must be a number." id="CarType_Id" name="CarType.Id">
                <option value="1">V2</option>
                <option value="2">x2</option>
                <option value="3">60-series</option>
            </select>

格式:

function saveSummary() {
    var payload = {
        Id: $("input[name=Id]").val(),
        CarType_Id: $("input[name=CarType.Id]").val(),
        SerialNo: $("input[name=SerialNo]").val()
    };
}

原始问题

我有一个 ajax呼叫,其工作方式如下:

function saveSummary() {
    var payload = {
        Id: $("input[name=Id]").val(),
        CarType: $("input[name=CarType]").val(),
        SerialNo: $("input[name=SerialNo]").val()
    };
    // post to edit action in home controller
    $.ajax({ 
        url: "/Home/Edit", type: "POST", 
        data: JSON.stringify(payload),
        contentType: 'application/json; charset=utf-8',
    error: function() {
            alert('Error updating table!')
        },
        success: function (data) {
            alert('Table updated!');
        }
     }

这成功通过了以下模型

public class MyObjectViewModel
{
    public int Id { get; set; }
    public string CarType { get; set; }
    public string SerialNo { get; set; }
}

执行此 controller (控制器)操作:

public ActionResult Edit(MyObjectViewModel model) { } // successfully populated model

现在让我们说我将CarType设为自己的类:

public class CarType
{
    public int Id { get; set; }
    public string Name { get; set; }
}

所以我的原始模型变为:

public class MyObjectViewModel
{
    public int Id { get; set; }
    public CarType CarType { get; set; }  // This is now a type / class
    public string SerialNo { get; set; }
}

然后如何添加CarType并将其传递给有效负载?

由于名称解析为Id,但我尝试仅获取CarType.Id,但是行CarType: $("input[name=CarType.Id]").val()无效。

我当时想我可能必须stringify对象本身然后附加它,但是我似乎无法使其正常工作。

HTML看起来像这样:

<form action="/Home/Edit/3572?..." method="post">
    <input name="__RequestVerificationToken" type="hidden" value="xyz">
                   <dl class="dl-vertical">
                        <dd>
                            <label for="SerialNo">Serial Number</label>:
                        </dd>
                        <dt>
                            megatron_5000
                        </dt>
                    </dl>
                    <dl class="dl-vertical">
                        <dd>
                            <label for="CarType">Car Type</label>:
                        </dd>
                        <dt>
                            <select data-val="true" data-val-number="The field Id must be a number." id="CarType_Id" name="CarType.Id">
                              <option value="1">V2</option>
                              <option value="2">x2</option>
                              <option value="3">60-series</option>
                </select>
                        </dt>
                    </dl>
            <input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." id="Id" name="Id" type="hidden" value="3572">
                    <input type="button" value="Save Changes" id="saveSummaryEditButton" onclick="saveSummary()">
                    <input type="button" value="Cancel Changes" id="cancelSummaryEditButton" onclick="cancelSummary()">
</form>

编辑

我尝试添加一个int CarTypeId来接收来自CarType.Id的值,但是如果我使用它则无法编译

CarType_Id: $("input[name=CarType.Id]").val()

0 个答案:

没有答案