时间戳

首页 > 解决方案 > 将对象的动态列表从视图发布到控制器

c# - 将对象的动态列表从视图发布到控制器

问题描述

我正在编写一个页面，允许用户在三天内输入测试坑的结果。最少有两个测试坑，最多有十个测试坑。

我最初在View中放了两个坑，并提供了添加和删除按钮，让用户可以添加更多的坑。看起来是这样的： 在此处输入图像描述 我用这个javascript添加更多的坑：

        var maxPits = 10;
    var minPits = 2;
    var wrapper = $(".pits");
    var addButton = $(".addPit");
    var delButton = $(".delPit");
    var x = 2;
    $(addButton).click(function (e) {
        e.preventDefault();
        if (x < maxPits) {
            x++;
            $(wrapper).append('<div class="row pit' + x + '"><div class="col-sm-1">Pit ' + x + '</div><div class="col-sm-3"><input type="number" placeholder="1.234" name="pit' + x + 'day1" id="pit' + x + 'day1"></div><div class="col-sm-3"><input type="number" placeholder="1.234" name="pit' + x + 'day2" id="pit' + x + 'day2"></div><div class="col-sm-3"><input type="number" placeholder="1.234" name="pit' + x + 'day3" id="pit' + x + 'day3"></div></div>');
            updatePitCount();
        } else {
            alert('too many pits!');
        }
    });

    $(delButton).click(function (e) {
        e.preventDefault();
        if (x > minPits) {
            var lastPit = '.pit' + x;
            $("div").remove(lastPit);
            x--;
            updatePitCount();
        } else {
            alert('must have a minimum of two!');
        }
    });

我的模型如下所示：

    public class ResultsModel
{
    public List<Pit> Pits { get; set; }
}

public class Pit
{
    public int Id { get; set; }
    public double Day1 { get; set; }
    public double Day2 { get; set; }
    public double Day3 { get; set; }
    public double Mean
    {
        get
        {
            var x = 0;
            var total = 0.0;

            if (Day1 > 0.0) { x += 1; total += Day1; }
            if (Day2 > 0.0) { x += 1; total += Day2; }
            if (Day3 > 0.0) { x += 1; total += Day3; }

            if(x>0) return (total) / x;
            return 0.0;
        }
    }
}

我的部分视图如下所示：

    <div class="container pits">
    <div class="row">
        <div class="col-sm-1 btn-group">
            <button class="btn btn-sm btn-success glyphicon glyphicon-plus addPit"></button>
            <button class="btn btn-sm btn-danger glyphicon glyphicon-minus delPit"></button>
        </div>
        <div class="col-sm-3">
            TEST 1
        </div>
        <div class="col-sm-3">
            TEST 2
        </div>
        <div class="col-sm-3">
            TEST 3
        </div>
    </div>
    <div class="row">
        <div class="col-sm-1">
            Pit 1
        </div>
        <div class="col-sm-3">
            <input type="number" placeholder="1.234" name="pit1day1" />
        </div>
        <div class="col-sm-3">
            <input type="number" placeholder="1.234" name="pit1day2" />
        </div>
        <div class="col-sm-3">
            <input type="number" placeholder="1.234" name="pit1day3" />
        </div>
    </div>
    <div class="row">
        <div class="col-sm-1">
            Pit 2
        </div>
        <div class="col-sm-3">
            <input type="number" placeholder="1.234" name="pit2day1">
        </div>
        <div class="col-sm-3">
            <input type="number" placeholder="1.234" name="pit2day2">
        </div>
        <div class="col-sm-3">
            <input type="number" placeholder="1.234" name="pit2day3">
        </div>
    </div>
</div>

该 html 采用发布到控制器的形式，我希望测试结果在控制器中可用，以便我可以对它们进行一些计算。我正在努力将页面中的数据导入模型

我想在控制器中这样做：

            foreach (var pit in model.Pits)
        {
            var x1 = pit.Day1;
            var x2 = pit.Day2;
            var x3 = pit.Day3;
            var m = pit.Mean;
            //do something...
        }

如何通过模型将视图中的动态数据获取到控制器中？

任何帮助，将不胜感激。

标签： c#asp.netasp.net-mvcmodel-view-controllerrazor

解决方案

当您将值表单视图传递给操作时，Razor 使用了名称属性的空间格式。

例子 ：

如果你通过

public class ResultsModel
{
    public List<Pit> Pits { get; set; }
}

模型进入视图和接收相同然后你的名称属性格式必须喜欢Pits[0].Day1。

所以你的html喜欢

<input type="number" placeholder="1.234" name="Pits[0].Day1" />
<input type="number" placeholder="1.234" name="Pits[1].Day1" />

所以一个。

还有一件事是使用for循环而不是foreach使用 razor 来生成项目列表。

如果你通过

List<Pit>

进入视图和接收相同然后你的名字属性格式必须像[0].Day1。

推荐阅读