Can't get Javascript Object to bind to a action Controller

Question

I can't seem to figure out how to get my Javascript object to bind to my model that is (as far as I can tell) just like it as far as properties go.

First the Javascript Object creation:

var transDetail = new Object();
transDetail.TransactionDetailID = transdetailId;
transDetail.TransactionID = "";
transDetail.Year = new Date().getFullYear();
transDetail.Volume = "";
transDetail.UnitPrice = "";
transDetail.TransferableVolume = "";
transDetail.Credits = "";
transDetail.Shares = "";
transDetail.DollarsPerShare = "";

It is then passed to this javascript function

function loadTransDetailEditCreate(d, cb, title, transactionDetail) {
    $.ajax(
        {
            url: '/TransactionDetail/LoadEditCreate',
            data: JSON.stringify(transactionDetail),
            dataType: 'json',
            success: function (result) {
                d.html(result);
                CreateEditTransDetail(d, cb, title, transactionDetail);
                d.dialog('open');
            }
        }
    );
}

I've verified that the year property before transmission is filled with 2015.

Now the model definition

public partial class TransactionDetail
{
    public int TransactionDetailID { get; set; }
    public int TransactionID { get; set; }
    public int Year { get; set; }
    public Nullable<int> Volume { get; set; }
    public Nullable<int> UnitPrice { get; set; }
    public Nullable<int> TransferableVolume { get; set; }
    public Nullable<int> Credits { get; set; }
    public Nullable<int> Shares { get; set; }
    public Nullable<int> DollarsPerShare { get; set; }

}

And the Action definition

public PartialViewResult LoadEditCreate(TransactionDetail transactionDetail)

When I break first thing into the action all non nullable ints are set to 0 and all nullable are set to null.

score 1 · Accepted Answer · edited May 23 '17 at 12:06

The problem is with sending the data: JSON...

You have 2 options:

use POST: (tried and works)

function loadTransDetailEditCreate(d, cb, title, transactionDetail) {
$.ajax(
    {
        type: 'post',                                      //added
        contentType: "application/json; charset=utf-8",    //added
        url: '/TransactionDetail/LoadEditCreate',
        data: JSON.stringify(transactionDetail),
        dataType: 'json',
        success: function (result) {
            d.html(result);
            CreateEditTransDetail(d, cb, title, transactionDetail);
            d.dialog('open');
        }
    }
  );
}

and decorate your controller with [HttpPost] attribute

[HttpPost]
public PartialViewResult LoadEditCreate(TransactionDetail transactionDetail)

If you want to use get - look here (didn't try, should work)

Awesome thank you. I used the first one and it worked. – Tyddlywink Aug 12 '15 at 17:33 — Tyddlywink, Aug 12 '15 at 17:33

Can't get Javascript Object to bind to a action Controller

1 Answers1