如何在 asp .net Core 中將列表列表從視圖發布到控制器？

Question

我想通過 Ajax 將數據列表發布到 asp .net 控制器。

 var DataList = { motherName: $("#motherName").val(), parentName: parentName, pieceName: pieceName, pieceFeatures: pieceFeatures, //pieceFeaturesList: null, featureValueLists: featureValueLists }; JQAjax("Post", "Add_KbyFeatures", DataList , function (data) { if (data) if (data.isSuccess) { //// } });

featureValueLists 是一個列表。

Answer 1

$("#your_button_id").on('click', function() { //if your button got clicked. This button going to get triggered
  if($("#your_button_id").on(':clicked')) {
    $.ajax({
      url: //Your URL to asp.net controller,
      type: "GET", //GET means getting the data, POST saving the data
      data: {
        motherName: $("#motherName").val(),
        parentName: parentName,
        pieceName: pieceName,
        pieceFeatures: pieceFeatures,
        //pieceFeaturesList: null,
        featureValueLists: featureValueLists
      }, //This is where you get the value for your controller
      dataType: "html", //dataType is the type if your result should be json or html
      success: function(result) { //if the controller gets the data and its not null or undefined it will throw it here
        $("your_result_show").html(result) //after the controller gets your data. The gathered data will show here
      }
    })
  }
})

Answer 2

下面是一個demo，大家可以參考一下：

事物：

 public class Thing
    {
        public string parentName { get; set; }
        public string pieceName { get; set; }
        public string pieceFeatures { get; set; }
        
    }

家庭控制器：

public class HomeController : Controller
    {
           public IActionResult Index()
           {
               return View();
           }
            [HttpPost]
            public void PassThings(IEnumerable<Thing> things)
            {
                // do stuff with things here...
            }
    }

索引視圖：

<input type="button"  id="btnProjectSave" name="but1" class="btn btn-default" value ="OnPostProjectSubmit">
<div  id="result">
    
</div>
@section Scripts{
    <script>
$(function() {
    $("#btnProjectSave").click(function(e) {
        e.preventDefault();
        var things = [
            {  
                parentName: 'parentName',
                pieceName: 'pieceName',
                pieceFeatures: 'pieceFeatures',//do your staff...
             },
            
        ];
        $.post('@Url.Action("PassThings")', { things: things },
            function() {
                $('#result').html('"PassThings()" successfully called.');
            });
    });
});
</script>
}

結果：