Как передать дочерний объект через ajax почтовый запрос

Question

Редактировать: упрощенный вопрос

Как передать целочисленное выбранное значение из следующих параметров:

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

Для этого контроллера действие:

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>

EDIT

Я попытался добавить int CarTypeId, чтобы получить значение от CarType.Id, но он не компилируется, если я использую

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