trx
trx

Reputation: 2157

AJax Call that pass KnockoutJS Observable Array to the HTTP Post Controller Method fails

I am trying to make a Ajax Call to the Http Controller POST method, the data passed from the ajax to Controller is the Array of JSON which is an ObserverableArray from KnockoutJS. The AAX Call to the HTTP Controller is like below

 $.ajax({
                    url: '/ORF/pdtInfo',
                    type: 'POST',
                    data: ko.toJSON(self.pdtDetails()),
                    success: function (result) {
                        console.log("OrderRequest - Recorded inserted Sucessfully" );
                    },
                    error: function (errorThrown) {
                        console.log("OrderRequest - Recorded insert Failed" +errorThrown.responseText );
                        callHandleUserError("Request Failed");
                    }
                })

The data that is ko.toJSON(self.pdtDetails()), passed to Controller is like

[{"pdtNeededTypes":["Individual","Other"],
  "stockNumber":"0054654354  |  y8fdts-Tg(hhhjhj)2Mnn/J          [Also Known as : O2 , OygR4-EhaFP]",
  "pdtNeeded":"Other",
  "pdtTypes":""}]

The Controller method is like below which receives array as input parameter

   public JsonResult pdtInfo(List<Models.ORFPdtInfo> orfpdtInfo)
    {
        try
        {
            if (Session["ORFData"] != null)
            {
                ORFData ORFData = Session["ORFData"] as ORFData;
                ORFData.pdtInfo = orfpdtInfo;
                Session["ORFData"] = ORFData;
                var result = new JsonResult()
                {
                    Data = orfpdtInfo,
                    MaxJsonLength = Int32.MaxValue
                };
                return result;
            }
            else
            {
                return Json(new { redirectUrl = Url.Action("Index", "ORF"), isRedirect = true });
            }
        }
        catch (Exception e)
        {
            return null;
        }
    }

Where the Model Class ORFPdtInfo is like

public class ORFPdtInfo
{
    public List<string> pdtNeededTypes { get; set; }
    public string stockNumber { get; set; }
    public string pdtNeeded { get; set; }
    public string pdtTypes { get; set; }
}

And the ORFData is the class where I am composing the email content, from Controller I am passing the data in to this class for composing the email body content

[Serializable]
public class ORFData
{
public List<ORFPdtInfo> pdtInfo { get; set; }

public string SerializedOrderData()
{
    StringBuilder orderText = new StringBuilder();
    for (int i=0;i<pdtInfo.Count();i++ ){
    orderText.AppendLine("<tr><td width='30%'>Pdt Needed </td><td width='70%'>" + pdtInfo[i].pdtNeeded + "</td></tr>");
    .... 

The issue is when the Ajax call that is made to the Controller method automatically goes to the error function. I tried to see the error by putting them in the console errorThrown.responseText but it is empty. I also set break point in the controller List<Models.ORFPdtInfo> orfpdtInfo is null,nothing is passed from the ajax call to the controller, am I missing anything with the Model class binding. Any help is greatly appreciated

Upvotes: 0

Views: 247

Answers (1)

trx
trx

Reputation: 2157

Adding the contentType: "application/json",to the POST method AJAX call fixed the issue

Upvotes: 1

Related Questions