.Net Core 2.0 Razor 页面句柄按钮点击数据

Question

对于 Razor Pages，当我希望用户单击表中的按钮，然后执行使用从行传递的元素进行操作的任务时，处理这种情况的最佳方法是什么？

到目前为止，我已经为这个表加载了一个数据模型，我希望他们单击​​一行并在我的操作中使用该行：

数据模型：

   public struct CollapseReportModel
{
    public HighLevelOutput Summary { get; set; }
    public IEnumerable<HighLevelOutput> WeeksOfData { get; set; }
}

表：

<div class="container">
    <div id="accordion">
        @{int counter = 0; }
        @foreach (var dataVM in Model.CollapseReport)
        {
            <div class="card">
                <div class="card-header" id="heading@(counter)">
                    <h5 class="mb-0">
                        <button class="btn btn-link" data-toggle="collapse" data-target="#collapse@(counter)" aria-expanded="true" aria-controls="collapse@(counter)">
                            @dataVM.ToString()

                        </button>
                    </h5>
                </div>

                <div id="collapse@(counter)" class="collapse" aria-labelledby="heading@(counter)" data-parent="#accordion">
                    <div class="card-body">

我正在尝试使用此按钮单击将数据发送到任务，但它只是传递空值：

                        <form method="post">
                            <input type="submit" class="btn btn-default" value="Add to Log" asp-page-handler="AddLog" asp-route-data="@dataVM.Summary.CorpCustomer, @dataVM.Summary.Item)" />
                        </form>

                        <ul class="list-group">
                            @foreach (var item in dataVM.WeeksOfData)
                            {
                                <li class="list-group-item">@($"{item.Item}, {item.ItemDescription}, {item.CorpCustomer}, {item.SummedOrder}, {item.SummedForecast}, {item.Difference}, {item.Week}")</li>
                            }
                        </ul>
                    </div>
                </div>
            </div>
            counter++;
        }
    </div>
</div>
<script src="~/jquery.js"></script>
<script src="~/bootstrap.js"></script>

到这个处理程序：

    public  Task<IActionResult> OnPostAddLog(string var1, string var2)
    {
        //Use elements from the row to perform an action
        var test = var1;
        var t2 = var2;

        return null;
    }

Answer 1

只需将输入添加到您的表单中，它们就会发布到您的操作中。

<form method="post">
    <input type="hidden" name="var1" value="@dataVM.WhateverProperty1" />
    <input type="hidden" name="var2" value="@dataVM.WhateverProperty2" />
    <input type="submit" class="btn btn-default" value="Add to Log" asp-page-handler="AddLog" asp-route-data="@dataVM.Summary.CorpCustomer, @dataVM.Summary.Item)" />
</form>

确保输入名称与操作中的参数名称相匹配。

另外，使用[HttpPost] 装饰您的OnPostAddLog 方法，因为您的表单使用POST 方法。