在一个视图中提交多个选项卡ASP.NET MVC

时间:2019-05-26 18:19:31

标签: asp.net-mvc model-view-controller tabs

我有一个ASP .NET应用程序,在视图上有多个选项卡,每个选项卡都包含每个课程参与者的多个输入(姓名,电话号码,职务等)。

我创建了一个jquery函数来从视图中收集数据并相应地生成JSON:

 function getAttendees() {
            var sections = [];

            $(".divWithInputs").each(function (i, val) {
                var tab = $(val).serializeArray();
                sections.push(tab);
            });

            return sections;
        }

和提交功能:

$("#checkoutAttendees").click(function () {
                var formData = new FormData();
                formData.append("Attendees", JSON.stringify(getAttendees()));

                $.ajax({
                    url: "/controllerURL",
                    type: 'POST',
                    contentType: "application/json; charset=utf-8",
                    cache: false,
                    contentType: false,
                    processData: false,
                    data: formData,
                    success: function (response) {
                        alert(response);
                    }
                });
            });

读取JSON时遇到问题,因为我需要一个IEnumerable Attendee对象来填充此类数据:

[  
   [  
      {  
         "name":"first-name-attendee-0",
         "value":"Jon"
      },
      {  
         "name":"last-name-attendee-0",
         "value":"Stark"
      },
      {  
         "name":"email-attendee-0",
         "value":"jon.stark@northwall.com"
      },
      {  
         "name":"phone-attendee-0",
         "value":"0181042981029840"
      },
      {  
         "name":"company-attendee-0",
         "value":"Nightwatch"
      },
      {  
         "name":"job-title-attendee-0",
         "value":"King"
      }
   ],
   [  
      {  
         "name":"first-name-attendee-1",
         "value":"Aria"
      },
      {  
         "name":"last-name-attendee-1",
         "value":"Stark"
      },
      {  
         "name":"email-attendee-1",
         "value":"noemail@nodomain.com"
      },
      {  
         "name":"phone-attendee-1",
         "value":"000000000000000"
      },
      {  
         "name":"company-attendee-1",
         "value":"No organization"
      },
      {  
         "name":"job-title-attendee-1",
         "value":"Killer"
      }
   ],
   [  
      {  
         "name":"first-name-attendee-2",
         "value":"Mad"
      },
      {  
         "name":"last-name-attendee-2",
         "value":"King"
      },
      {  
         "name":"email-attendee-2",
         "value":"mad.king@yahoo.com"
      },
      {  
         "name":"phone-attendee-2",
         "value":"019209840921840219"
      },
      {  
         "name":"company-attendee-2",
         "value":"Kingdom"
      },
      {  
         "name":"job-title-attendee-2",
         "value":"King"
      }
   ]
]

有人建议如何将JSON中的数据正确地转换为与会者列表吗?

谢谢。

1 个答案:

答案 0 :(得分:0)

解决方案:在后端,我必须创建一个NameValuePair列表列表

Action方法如下:

[HttpPost]
        public ActionResult TrainingBook(FormCollection formCollection)
        var viewModel = new TrainingFormViewModel();

        var attendeesListJSON = formCollection["Attendees"];

        var attendeesJson = JsonConvert.DeserializeObject<List<List<KeyValuePair<string, string>>>>(attendeesListJSON);

        List<Attendees> attendees = new List<Attendees>();

        foreach (var item in attendeesJson)
        {
            attendees.Add(new Attendees {
                FirstName = item[0].Value,
                LastName = item[1].Value,
                WorkEmailAddress = item[2].Value,
                PhoneNumber = item[3].Value,
                Organization = item[4].Value,
                JobTitle = item[5].Value
            });
        }

键值对是输入的名称和值,键值对的第一个列表是一个与会者,列表的列表ofc是所有与会者。