Ko ObservableArray not updated via WebAPI

Question

I have an observable array of Object, which is created as follows:

 self.SelectedVariable = ko.observableArray();
    self.VarUpdate = function (data) {
        $.getJSON("/api/Variable/" + ko.toJS(data.VarID), ko.toJS(data.VarID), function (Result) {
            for (var i = 0; i < Result.length; i++) {
                element = Result[i];
                self.SelectedVariable({ VariableID: ko.observable(element.VariableID), VariableDateLastUpdated: ko.observable(element.VariableDateLastUpdated), VariableName: ko.observable(element.VariableName), VariableDescription: ko.observable(element.VariableDescription), VariableValue: ko.observable(element.VariableValue), VariableType: ko.observable(element.VariableType) });
            };
        });

When I try to pass a SelectedVariable object to my WebAPI method using this AJAX call

  $.ajax({
            url: "/api/Variable?Del=0",
            data: { vardata: ko.toJS(self.SelectedVariable) },
            type: "PUT",
            dataType: "JSON",
            timeout: 10000,
            success: function (Result) {

            },
            error: function (xhr, status) {
                alert(status + " - " + xhr.responseText);
            }
        });

all related objects show zero in all fields. I tried almost every combination to get a SelectedVariable object to properly parse my WebAPI method:

data: { vardata: ko.toJS(self.SelectedVariable) },

data: { vardata: ko.toJSON(self.SelectedVariable) },

data: { vardata: JSON.Stringify(self.SelectedVariable) },

data: { vardata: self.SelectedVariable },

and tried to manually decrypt the JSON object on the WebAPI side using:

    public void Put([FromUri] int Del, [FromBody]string vardata)
    {

        Variables vari = JsonConvert.DeserializeObject<Variables>(vardata);

        var Item = (from c in TMIRE.Variables
                    where c.VariableID == vari.VariableID
                    select c).First();

        if (Del == 0)
        {
            Item.VariableDateUpdated = DateTime.Now;
            Item.VariableName = vari.VariableName;
            Item.VariableDescription = vari.VariableDescription;
            Item.VariableValue = vari.VariableValue;
            Item.VariableType = vari.VariableType;

And still an empty meaning.

Any consultation would be greatly appreciated!

UPDATE

My WebAPI method has been modified to look like this:

 public void Put([FromUri] int Del, IEnumerable<Variables> vardata)
    {
        var Item = (from c in TMIRE.Variables
                    where c.VariableID == vardata.Select(x => x.VariableID).First()
                    select c).First();
        if (Del == 0)
        {
            Item.VariableDateUpdated = DateTime.Now;
            vardata.Select(a => Item.VariableName = a.VariableName);
            vardata.Select(b => Item.VariableDescription = b.VariableDescription);
            vardata.Select(c => Item.VariableValue = c.VariableValue);
            vardata.Select(d => Item.VariableType = d.VariableType);
        }

vardata​​strong > , Ajax :

 alert(ko.toJSON(self.SelectedVariable));
        $.ajax({
            url: "/api/Variable?Del=0",
            contenttype: "application/x-www-form-urlencoded",
            data: "=" + ko.toJSON(self.SelectedVariable()),
            type: "PUT",
            dataType: "JSON",
            timeout: 10000,
            success: function (Result) {

            },
            error: function (xhr, status) {
                alert(status + " - " + xhr.responseText);
            }
        });

 public class Variables
{
    public int VariableID { get; set; }
    public DateTime VarialbeDateLastUpdated { get; set; }
    public string VariableName { get; set; }
    public string VariableDescription { get; set; }
    public string VariableValue { get; set; }
    public string VariableType { get; set; }

}

Ajax

  $.ajax({
            url: "/api/Variable?Del=0",
            contenttype: "application/x-www-form-urlencoded",
            data: "=" + ko.toJSON(self.SelectedVariable),
            type: "PUT",
            dataType: "JSON",
            timeout: 10000,
            success: function (Result) {

            },
            error: function (xhr, status) {
                alert(status + " - " + xhr.responseText);
            }
        });

Newtonsoft WebAPI :

public void Put([FromUri] int Del, [FromBody]string vardata)
    {

        Variables vari = JsonConvert.DeserializeObject<Variables>(vardata.Substring(1, vardata.Length-2));

        var Item = (from c in TMIRE.Variables
                    where c.VariableID == vari.VariableID
                    select c).First();

        if (Del == 0)
        {
            Item.VariableDateUpdated = DateTime.Now;
            Item.VariableName = vari.VariableName;
            Item.VariableDescription = vari.VariableDescription;
            Item.VariableValue = vari.VariableValue;
            Item.VariableType = vari.VariableType;
        }
        else
        {
            Item.VariableDateUpdated = DateTime.Now;
            Item.VariableActive = false;
        }

        TMIRE.SaveChanges();
    }

Answer 1

Ajax

       $.ajax({
        url: "/api/Variable?Del=0",
        contenttype: "application/x-www-form-urlencoded",
        data: "=" + ko.toJSON(self.SelectedVariable),
        type: "PUT",
        dataType: "JSON",
        timeout: 10000,
        success: function (Result) {

        },
        error: function (xhr, status) {
            alert(status + " - " + xhr.responseText);
        }
    });

Newtonsoft WebAPI :

public void Put([FromUri] int Del, [FromBody]string vardata)
{

    Variables vari = JsonConvert.DeserializeObject<Variables>(vardata.Substring(1, vardata.Length-2));

    var Item = (from c in TMIRE.Variables
                where c.VariableID == vari.VariableID
                select c).First();

    if (Del == 0)
    {
        Item.VariableDateUpdated = DateTime.Now;
        Item.VariableName = vari.VariableName;
        Item.VariableDescription = vari.VariableDescription;
        Item.VariableValue = vari.VariableValue;
        Item.VariableType = vari.VariableType;
    }
    else
    {
        Item.VariableDateUpdated = DateTime.Now;
        Item.VariableActive = false;
    }

    TMIRE.SaveChanges();
}

Answer 2

...

public void Put([FromUri] int Del, IEnumerable<Variables> vardate){}

self.SelectedVariable = ko.observableArray();, API IEnumerable.

Ajax, , :

data: { vardata: ko.toJSON(self.SelectedVariable) }

JSON .

, KO, ? self.SelectedVariable.push({...}); .

Answer 3

:

    self.SelectedVariable = ko.observableArray();
    self.VarUpdate = function (data) {
        $.getJSON("/api/Variable/" + ko.toJS(data.VarID), ko.toJS(data.VarID), function (Result) {
            var selection = self.SelectedVariable;
            for (var i = 0; i < Result.length; i++) {
                var element = Result[i];
                selection.push(element);
            };
        });

, ajax json:

    $.ajax({
        url: "/api/Variable?Del=0",
        content-type: "application/x-www-form-urlencoded",
        data: "=" + JSON.stringify(ko.toJSON(self.SelectedVariable)),
        type: "PUT",
        dataType: "JSON",
        timeout: 10000,
        success: function (Result) {

        },
        error: function (xhr, status) {
            alert(status + " - " + xhr.responseText);
        }
    });

[FromBody].

public void Put([FromUri] int Del, IEnumerable<Variables> vardata)
{
    ...
}

, vardata, ko.observable mvc .

:

data: "=" + JSON.stringify(ko.toJSON(self.SelectedVariable))

data: "=" + JSON.stringify(self.SelectedVariable())

data: "=" + self.SelectedVariable()

data: "=" + $.parseJSON(ko.toJSON(self.SelectedVariable))

Answer 4

, self.SelectedVariable - . ? self.SelectedVariable.push(resultObject).