将jquery对象数组传递给接受列表对象的mvc动作

I have a form in my view which has only one textarea input initially and user can add more textarea inputs if he wants with jquery. My problem is related to second case. After submitting the form i am getting an array of objects in console but when i am passing this array to mvc action in my controller it is coming to be null. I have tried these solution but did not succeed:

我的视图中有一个表单,最初只有一个textarea输入,如果他想用jquery,用户可以添加更多的textarea输入。我的问题与第二种情况有关。提交表单后,我在控制台中获取了一组对象,但是当我将此数组传递给我的控制器中的mvc操作时,它将变为null。我尝试过这些解决方案,但没有成功:

Send array of Objects to MVC Controller

将对象数组发送到MVC控制器

POST a list of objects to MVC 5 Controller

将对象列表POST到MVC 5 Controller

here is my code:-

这是我的代码: -

jquery code:

$('body').on('submit', '#addTextForm', function () {
   console.log($(this));
   var frmData = $(this).serializeArray();
   console.log(frmData);
   $.ajax({
       type: 'post',
       url: '/Dashboard/UploadText',
       contentType: 'application/json',
       data: JSON.stringify({ obj: frmData }),
       success: function (data) {
          console.log(data);
       },
       error: function (data) {
          console.log(data);
       }
   });
  return false;
});

MVC action:

[HttpPost]
public string UploadText(SliderTextList obj)
{
  return "success";      
}

my object class:

我的对象类:

public class SliderText
{
  [JsonProperty("Id")]
  public int Id { get; set; }

  [JsonProperty("SlideName")]
  public string SlideName { get; set; }

  [JsonProperty("Content")]
  public string Content { get; set; }

}
public class SliderTextList
{
  public List<SliderText> AllTexts { get; set; }
}

I have to store the Content in json file with Id and SlideName, so i think i have to pass a list object in mvc action Uploadtext which is coming out to be null always. Please help.

我必须使用Id和SlideName将内容存储在json文件中,所以我认为我必须在mvc action Uploadtext中传递一个列表对象,它始终是null。请帮忙。

2 个解决方案

#1

$(document).ready(function(){
   $('body').on('submit', '#addTextForm', function () {
   var listData=[];
   var oInputs = new Array();
   oInputs = document.getElementsByTag('input' );
   var k=1;
   for ( i = 0; i < oInputs.length; i++ )
   {  
       if ( oInputs[i].type == 'textarea' )
       {
          var obj=new Object();
          obj.Id=k;
          obj.SlideName=oInputs[i].Name;
          obj.Content=oInputs[i].Value;
          K=parseInt(k)+1;
          listData.push(obj);
       }
   }
   $.ajax({
           type: 'post',
           url: '/Dashboard/UploadText',
           contentType: 'application/json',
           data: JSON.stringify(listData),
           success: function (data) {
                       console.log(data);
           },
           error: function (data) {
           console.log(data);
          }
     });
    return false;
   });
});

#2

Since the sever side expects a string as argument obj as a query string I think this is what you need.

由于服务器端需要一个字符串作为参数obj作为查询字符串,我认为这就是你需要的。

data: { 
    obj: JSON.stringify(frmData) 
},

as an alternative using as Stephen suggested on the comments

作为斯蒂芬在评论中提出的替代方案

data: { 
    obj: $('#addTextForm').serialize()
},

#1

$(document).ready(function(){
   $('body').on('submit', '#addTextForm', function () {
   var listData=[];
   var oInputs = new Array();
   oInputs = document.getElementsByTag('input' );
   var k=1;
   for ( i = 0; i < oInputs.length; i++ )
   {  
       if ( oInputs[i].type == 'textarea' )
       {
          var obj=new Object();
          obj.Id=k;
          obj.SlideName=oInputs[i].Name;
          obj.Content=oInputs[i].Value;
          K=parseInt(k)+1;
          listData.push(obj);
       }
   }
   $.ajax({
           type: 'post',
           url: '/Dashboard/UploadText',
           contentType: 'application/json',
           data: JSON.stringify(listData),
           success: function (data) {
                       console.log(data);
           },
           error: function (data) {
           console.log(data);
          }
     });
    return false;
   });
});

#2