Not able to Pass object values from javascript to controller

Question

I am trying to pass a string of objects from my javascript to the controller. But when I run the code, nothing is passed to the controller, all I get is a null value. I go through debugging and I can see the string of data that should be passed, but it never goes or hits the controller. Here is my code below.

What I want it to pass is the ContactID, Address, ContactName and Phone. When I debug, I can see that it's passing/getting the data, but it doesn't pass to the controller. I have tried doing a string[ ] obj, but I still get a null reference. I am sure I am missing something, and just needing someone to point me in the right direction.

Thanks in Advance!

JavaScript:

  function saveEdit(element) {
    var form = $(element).closest('tr');
    model = retrieveEditCustomerModel(form);
    PostObject("Home/Update", model, replacethisEditRow, element);
}
function retrieveEditCustomerModel(form) {
    var model = new Object();
    model.CompanyID = $(form).find('.customer-stored-id').attr('data-value');
    model.CompanyName = $(form).find('#SelectedCustomer_CompanyName').val();
    model.Address = $(form).find('#SelectedCustomer_Address').val();
    model.ContactName = $(form).find('#SelectedCustomer_ContactName').val();
    model.Phone = $(form).find('#SelectedCustomer_Phone').val();
    return model;
}

function replacethisEditRow(result, element) {
    $(element).closest('tr').replaceWith(result);
}


__________________________________________________________________________
function PostObject(url, object, callback, param1, param2, errorCallback) {
    var data = JSON.stringify(object);
    $.ajax({
        url: "../../"+ url ,
        data: data,
        type: "POST",
        dataType: 'json',
        contentType: "application/json",
        success: function (result) {
            if (callback != null && callback != undefined) {
                callback(result, param1, param2);
            }
        },
        error: function (result) {
            if (errorCallback != undefined) {
                errorCallback(result.responseText);
            }
            else {
                if (result.responseText != '') {
                    alert(result.responseText);
                }
                else {
                    alert("An error occurred while processing results.  Please consult an administrator.");
                }
            }
        }
    });
}

Controller:

  public ActionResult Update(CustomersViewModel obj)
        {
            using (CustomerEntities db = new CustomerEntities())
        {


      Customer existing =  db.Customers.Find(obj.SelectedCustomer.CustomerID);

            existing.CompanyName = obj.SelectedCustomer.CompanyName;
            existing.Address = obj.SelectedCustomer.Address;
            existing.ContactName = obj.SelectedCustomer.ContactName;
            existing.Phone = obj.SelectedCustomer.Phone;
            db.SaveChanges();

            CustomersViewModel model = new CustomersViewModel();
           model.Customers = db.Customers.OrderBy(m =>   m.CustomerID).Take(5).ToList();

            model.SelectedCustomer = existing;
            model.DisplayMode = "ReadOnly";
            return View("Index", model);
        };
    }  

Adding Class

  public class CustomersViewModel
{
    //This property holds a list of customers to be displayed on the view
    public List<Customer> Customers { get; set; }

    //This property points to a customer that is selected by the user if no customer is selected then it will be null. 
    public Customer SelectedCustomer { get; set; }

    // This property indicates the mode of the customer details area.  Possible values are readonly after selecton.   
    public string DisplayMode { get; set; }
}

Answer 1

You are sending the SelectedCustomer as the entire object in the POST body.

change your function to return { SelectedCustomer: model };

function retrieveEditCustomerModel(form) {
    var model = new Object();
    model.CompanyID = $(form).find('.customer-stored-id').attr('data-value');
    model.CompanyName = $(form).find('#SelectedCustomer_CompanyName').val();
    model.Address = $(form).find('#SelectedCustomer_Address').val();
    model.ContactName = $(form).find('#SelectedCustomer_ContactName').val();
    model.Phone = $(form).find('#SelectedCustomer_Phone').val();
    /* return model; */
    return { SelectedCustomer: model };
}

This will populate the C# Model properly.

Answer 2

发生这种情况的原因是您没有为控制器设置属性[HttpPost] 。