MVC4 - Saat Melewati model Kompleks ke Kontroler menggunakan Ajax

Ini adalah fungsi Java Script yang dipanggil ketika pengguna mengklik tambahkan ke keranjang, saya menguji panggilan Ajax saya sebelum saya memasukkan semua logika saya untuk membangun nilai yang benar dari formulir saya, (kode yang sangat sulit untuk saat ini.)

    function AddItem() {

    var myproduct = { Id: 1, Price: 17, ProductName:"product name" }

    var cartItem = { Quantity: 1, Product: myproduct };


    $.ajax({
        url: "/Cart/AddItem",
        type: 'post',
        data: cartItem,
        success: function (data) {
            if (data.IsSuccess) {
                alert("test Hello Success");
            }

            alert("test HELLO Fail");
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert(errorThrown + "- Error");
        }
    });
}

Masalahnya adalah ketika menguji Java Script ini, parameter saya yang diketik dengan kuat di dalam tindakan pengontrol saya hanya memiliki beberapa nilai yang ditetapkan, Tindakan pengontrol saya terlihat seperti ini:

[HttpPost]
    public JsonResult AddItem(CartItem cartItem)
    {  
        cartItem.Cart = cartService.GetCartCurrent(this);
        cartService.SaveCartItem(cartItem);

       //bla bla bla

     }

Definisi Item Keranjang terlihat seperti ini:

[Serializable]
public class CartItem
{
    [Key]
    public int Id { get; set; }
    public virtual Product Product { get; set; }
    public virtual List<SelectedProductOption> SelectedProductOptions { get; set; }
    public virtual Cart Cart { get; set; }
    public int Quantity { get; set; }

}

Jadi ketika saya menetapkan break-point CartItem.Quaintity = 1 tetapi CartItem.Product BUKAN NULL tetapi nilai Product.Id = 0 dan Product.Price adalah 0.

Mengapa??

Bagaimana Anda mengatur objek bagian dalam model kompleks.

Ada ide?