Razor 视图的有界属性在发布后未更新答案

【问题标题】：Razor view's bounded property not updating after postRazor 视图的有界属性在发布后未更新
【发布时间】：2019-06-18 19:05:05
【问题描述】：

在OnPostOrder() 执行后，我无法在下面的示例剃刀视图中更新属性价格。我编写了这个示例视图来执行以下操作：

更改产品选择列表时，使用 jquery 的submit() 提交 ProductForm。
在提交 ProductForm 时使用asp-page-handler 来点击OnPostOrder()。注意：如果我的示例中存在语法问题，这在我的实现中有效。
我从自定义静态函数中获取所有产品选项，然后通过 productid 获取匹配产品。
我将匹配产品的价格设置为 Price 属性。 但是，这不会更新 Price 属性。

示例视图：

@page
@{
    @functions{
        [BindProperty] public string Product { get; set; }
        [BindProperty] public decimal Price { get; set; }

        public void OnPostOrder()
        {
            Price = 25.00;
        }
    }
    List<ProductOption> productOptions = AdminUtil.GetProductOptions();
    SelectList productOptionSelectList = new SelectList(productOptions, "ProductId", "Name");
}

<form method="post" id="ProductForm" asp-page-handler="order">
    Product: <select asp-for="Product" asp-items="@productOptionSelectList"></select> <br />
    Order Amount: <input asp-for="Price" /> <br />
</form>

@section Scripts {
    <script>
        $(function () {
            $('#Product').on('change', function () {
                $("#ManualOrderForm").submit();
            });
        });
    </script>
}

我是剃刀页面的新手，所以如果这是一个重复的问题，请指出我正确的方向。我找不到可比较的例子，但我可能没有搜索到正确的术语。

似乎有道理的一个原因是asp-for 生成了HTML name 和value 属性。但是当我在OnPostOrder() 之后调试页面时，我可以点击<input asp-for="OrderAmount" />。

【问题讨论】：

您通过执行AdminUtil.GetProductOptions() 方法并使用该方法的输出来获取价格。调试该方法调用并查看该方法返回预期值。与您的表单提交无关。
price 属性确实发生了变化，我遵循了刚才的断点。只是不在表格上。
我还是不明白你的预期行为是什么。
我更新了我的OnPostOrder() 将值设置为 25。假装它之前是 0。执行OnPostOrder() 方法后，表单上的值仍为0。那不应该改变表单的价值吗？
您希望在哪里看到 25 ？您当前没有在表单中打印Price 属性值。那么您希望它在哪里显示呢？你的 OnPost 方法也应该返回一些东西。

标签： c# asp.net-core razor-pages

【解决方案1】：

这是因为在渲染输入元素标记时，输入标签助手首先检查模型状态字典中的任何值，如果找到该属性的值，则将使用该值。这就是您看到通过表单提交从输入元素传递的原始值的原因。

解决方案是从模型状态字典中删除此特定项。您可以使用ModelState.Remove 方法来执行此操作。

public IActionResult OnPost()
{       
    this.Price = 25;

    ModelState.Remove("Price");  // This line does the trick
    return Page();
}

我还建议您为您的属性使用正确的类型。如果您正在处理数值，请使用数值类型，例如 int 或 decimal，而不是字符串。

【讨论】：

我不在电脑旁。我会尽快尝试。感谢所有的帮助。
这很有效，谢谢！顺便说一下，价格是小数。
哇...这太隐蔽了。我已经为此苦苦挣扎了几个小时，直到我偶然发现了这篇文章！你知道关于这方面的任何参考资料吗？
我需要 ModelState.Remove("Price");价格=空；完成这项工作

【解决方案2】：

this.StateHasChanged(); 很适合我

public void OnPost()
{   
    this.Price = 25; //change value
    this.StateHasChanged(); //tells page to update
}

【讨论】：