如何在asp.net mvc中发布动态ng-model列表

时间:2015-09-08 04:49:17

标签: c# angularjs asp.net-mvc-4 angularjs-scope angularjs-ng-repeat

模型

public class DynamicModel
{
   public List<string> PayoutID { get; set; }
   public List<string> PayoutType { get; set; }
}

控制器

[HttpPost]
public ActionResult DynamicDiv(DynamicModel model)
{
  return View();
}

使用AngularJs模型绑定查看

<script src="~/Scripts/angular.js"></script>
    <script>
        var app = angular.module('myApp',[]);
        app.controller("myController", function ($scope, $http) {
            $scope.Payout = {
                PayoutID: '',
                PayoutType: ''
            };
            $scope.SendDynamicData = function () {
                $http({
                    method: 'post',
                    url: '/Home/DynamicDiv',
                    data: { model: $scope.Payout }
                }).success(function (data) {
                    alert(data.Message);
                }).error(function () {
                    alert("Something went Wrong");
                });
            };
        });
    </script>

<div ng-app="myApp" ng-controller="myController">
@using (@Html.BeginForm("DynamicDiv", "Home", FormMethod.Post))
{

    <div>
        <div class="form-group">
            <label>Enter Payout ID</label>
            <input type="text" class="form-control" ng-model="Payout.PayoutID" name="Payout.PayoutID" />
        </div>
        <div class="form-group">
            <label>Enter Payout Type</label>
            <input type="text" class="form-control" ng-model="Payout.PayoutType" name="Payout.PayoutType" />
        </div>

       <div class="form-group">
                <label>Enter Payout ID</label>
                <input type="text" class="form-control" ng-model="Payout.PayoutID" name="Payout.PayoutID" />
            </div>
            <div class="form-group">
                <label>Enter Payout Type</label>
                <input type="text" class="form-control" ng-model="Payout.PayoutType" name="Payout.PayoutType" />
            </div>
    </div>

            <div class="form-group">

            <input type="button" class="btn btn-success" ng-click="SendDynamicData()" value="Submit" />
        </div>
}
</div>

如果我们动态添加两个或更多文本框,那么前面的值应该是list<string>的形式。 (如果我使用的是一个文本框(一个ng-model),它工作正常。)

如何将这些值发送给控制器?

1 个答案:

答案 0 :(得分:0)

我认为你不应该让你的模型包含两个列表,而是让一个DynamicSomething是一个单独的节点(带有ID和Type)。您的模型可能是您可以传递的DynamicSomething列表。