• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 278
  • Last Modified:

Post a list<data> from Dialog to Controller with JQuery

Hi Again Experts ,
I have a dialog filling up with records which need editing then posted back to a controller. I have the dialog filling no problem but when I edited the records and press save it goes to the controller but has no data with it.
This is the code I'm using in the function
   function updateConfirmedPercentages() {
        //if ($("#ConfirmPercentages").valid()) {
            $.ajax({
                url: "/CAR/SaveConfirmedPercentages/",
                data: $("#ConfirmPercentages").serialize(),
                type: "POST",
                datatype: "html",                
                success: function (result) {
                    alert("Record Updated!");
                },
                error: function (c) {
                    alert(c.text);
                    $('#dialog').dialog().dialog('destroy');
                }
            });
        }

Open in new window

and then when it gets to the controller the "collection" is null
 
  public void SaveConfirmedPercentages(List<MOTOR_Percentage_Extended> collection)
        {
            foreach (MOTOR_PERCENTAGES mp in collection)
            {
                CarRepository ccr = new CarRepository();
                ccr.UpdateConfirmedPercentages(mp);
            }
        }

Open in new window


I know I am passing a formCollection to the Action but then I am looking for a List<t> in the action but I have changed the code that much, I would like to send a list to the Action but I am not sure if that is even possible.
Any words of wisdom would be highly appreciated.
Thanks
0
Niall292
Asked:
Niall292
  • 3
  • 3
1 Solution
 
Niall292Author Commented:
I now have changed the code in the UpdateConfirmedPercentages function and it is sending the right amount of  items across but they are all null. Can somebody tell what I'm doing wrong
function updateConfirmedPercentages() {
        var rowdata = [];
        $('#myResults').find('tr').each(function () {
            myjson = [];
            item = {}
            item["colid"] = $(this).find("#colid").val();
            //item["merchantid"] = $(this).find("#merchantid").val();
            item["year1"] = $(this).find("#year1").val();
            item["year2"] = $(this).find("#year2").val();
            item["year3"] = $(this).find("#year3").val();
            item["year4"] = $(this).find("#year4").val();
            item["year5"] = $(this).find("#year5").val();
            myjson.push(item);
            rowdata.push(myjson);
        });
        jsonstring = JSON.stringify(rowdata);
        $.ajax({
            url: "/Merchant/SaveConfirmedPercentages/",
            data: jsonstring,
            type: "POST",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                alert("Record Updated!");
            },
            error: function (c) {
                alert(c.text);
                $('#dialog').dialog().dialog('destroy');
            }
        });
    }

Open in new window


Thanks in advance
0
 
Ioannis ParaskevopoulosCommented:
Hi,

Could you please post the definition of MOTOR_Percentage_Extended model?

Can you also post what jsonstring has before doing the ajax?

Thanks,
Giannis
0
 
Niall292Author Commented:
Giannis,
Thanks for your help.
here is your info also I attached part of a screen shot before jsonstring reaches Ajax
public partial class MOTOR_PERCENTAGES
    {
        public int COL_ID { get; set; }
        public string MOTOR_ID { get; set; }
        public int AGENT_ID { get; set; }
        public Nullable<decimal> FIRST_YEAR { get; set; }
        public Nullable<decimal> SECOND_YEAR { get; set; }
        public Nullable<decimal> THIRD_YEAR { get; set; }
        public Nullable<decimal> FOURTH_YEAR { get; set; }
        public Nullable<decimal> FIFTH_YEAR { get; set; }
        public Nullable<System.DateTime> DATE { get; set; }
        public bool DISABLED { get; set; }
        public Nullable<System.DateTime> DATE_ENTERED { get; set; }
    }

   public class MOTOR_Percentage_Extended: MOTOR_PERCENTAGES
    {    
        public string AgentName { get; set; }
    }

Open in new window

firfox.png
0
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

 
Ioannis ParaskevopoulosCommented:
It is as i suspected.

If you see your screenshot you have something like the following:

[[{
    "colid": "17499",
    "year1": "10.0",
    .....
}],[{
    "colid": "17530",
    "year1": "30.0",
}]]

Open in new window


This indicates that the data that you sent to the server is a big array that contains a set of arrays, each of which contain a single object. So what you sent would be interpreted like a List<List<OfModelType>>. I am saying OfModelType because if you see the properties of each object sent from your post, it will not match to the properties of your model (MOTOR_PERCENTAGES).

In your js code you have:

        var rowdata = [];
        $('#myResults').find('tr').each(function () {
            myjson = [];
            item = {}
            item["colid"] = $(this).find("#colid").val();
            //item["merchantid"] = $(this).find("#merchantid").val();
            item["year1"] = $(this).find("#year1").val();
            item["year2"] = $(this).find("#year2").val();
            item["year3"] = $(this).find("#year3").val();
            item["year4"] = $(this).find("#year4").val();
            item["year5"] = $(this).find("#year5").val();
            myjson.push(item);
            rowdata.push(myjson);
        });

Open in new window


You are defining an array rawdata.

Then for each of the rows in "#myResults" you are defining a new array myjson and a new object item. Again in each iteration you add the item in myjson and myjson in rowdata.

What you need to do is remove myjson from your code and add the items directly to rowdata:

        var rowdata = [];
        $('#myResults').find('tr').each(function () {
            item = {}
            item["colid"] = $(this).find("#colid").val();
            //item["merchantid"] = $(this).find("#merchantid").val();
            item["year1"] = $(this).find("#year1").val();
            item["year2"] = $(this).find("#year2").val();
            item["year3"] = $(this).find("#year3").val();
            item["year4"] = $(this).find("#year4").val();
            item["year5"] = $(this).find("#year5").val();
            rowdata.push(item);
        });

Open in new window


This will solve the issue of creating a proper List<List<OfModelType>> instead of the correct List<OfModelType>.

The second issue you have is that the item objects in your JSON cannot be mapped to your requested model.

You need to change your code to make it so item object have properties that can be mapped to your model. (I am not really sure if it is case sensitive, but i would bet it is).

So your code should look like this:

        var rowdata = [];
        $('#myResults').find('tr').each(function () {
            item = {}
            item["COL_ID"] = $(this).find("#colid").val();
            //item["AGENT_ID"] = $(this).find("#merchantid").val();
            item["FIRST_YEAR"] = $(this).find("#year1").val();
            item["SECOND_YEAR"] = $(this).find("#year2").val();
            item["THIRD_YEAR"] = $(this).find("#year3").val();
            item["FOURTH_YEAR"] = $(this).find("#year4").val();
            item["FIFTH_YEAR"] = $(this).find("#year5").val();
            rowdata.push(item);
        });

Open in new window


Try with this sample and let me know how it goes.

Giannis
0
 
Niall292Author Commented:
Thank you for helping also your descriptive answer, helps to hopefully not make the same mistake again.
0
 
Ioannis ParaskevopoulosCommented:
Anytime :-)
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now