即使使用 [BindProperty(SupportsGet = true)]，Razor 页面也不会在 POST 上绑定属性答案

【问题标题】：Razor pages not binding property on POST even with [BindProperty(SupportsGet = true)]即使使用 [BindProperty(SupportsGet = true)]，Razor 页面也不会在 POST 上绑定属性
【发布时间】：2020-11-28 21:27:36
【问题描述】：

我是 Razor 页面的初学者，我正在尝试做一些非常基本的数据绑定。但是，我不明白为什么 .netcore 不绑定我的属性。

我在看这个帖子，但没有帮助：

ASP.NET Core Razor pages - not binding on POST Request

这是我的属性：

    [BindProperty(SupportsGet = true)]
    public int width { get; set; }

    [BindProperty(SupportsGet = true)]
    public int height { get; set; }

我的 onPost 和 onGet

    public IActionResult OnGet(string type)
    {
        minLength = BarcodeConstants.BarCodeMinLength;
        width = 256;
        height = 256;
        other stuff...


    public IActionResult OnPost(string type)
    {
        minLength = BarcodeConstants.BarCodeMinLength;

        Debug.WriteLine("Image width = " + width);
        Debug.WriteLine("Image height = " + width);
        other stuff...

这是我的cshtml。不知道这两个是不是搞砸了。

    <form method="post" asp-page="QRBarCode">
        <input type="text" placeholder="Input value" name="inputVal" value="@Model.inputVal" />
        <input type="submit" value="Generate QR Barcode" />
    </form>

    <qrcode content="@Model.inputVal"
            type="@Model.titleType"
            alt="QR Code"
            width="@Model.width"
            height="@Model.height" />

    <form method="post" class="mt-3" enctype="multipart/form-data" asp-page-handler="OnPost">
        <div class="form-group row">
            <div class="col-sm-10" style="max-width: 12rem;">
                <input asp-for="@Model.width" class="form-control" placeholder="Image @Model.width" />
            </div>
        </div>

        <div class="form-group row">
            <div class="col-sm-10" style="max-width: 12rem;">
                <input asp-for="@Model.height" class="form-control" placeholder="Image @Model.height" />
            </div>
        </div>
    </form>

但是当我在宽度/高度字段中输入一个不同于 0 的值时，它总是在 onPost 中显示为零，请参阅日志

'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.5\System.Security.Principal.Windows.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled.
Image width = 0
Image height = 0

我做错了什么？看起来很基础。感谢您的帮助。

谢谢。

【问题讨论】：

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

【解决方案1】：

你有两种形式。您的第二个表单永远不会提交，因此其中的值永远不会发布。如果您希望宽度和高度与inputVal 一起发布，您应该在第一个表单中包含宽度和高度输入。

<form method="post" asp-page="QRBarCode">
    <input type="text" placeholder="Input value" name="inputVal" value="@Model.inputVal" />
    <qrcode content="@Model.inputVal"
        type="@Model.titleType"
        alt="QR Code"
        width="@Model.width"
        height="@Model.height" />
    <div class="form-group row">
        <div class="col-sm-10" style="max-width: 12rem;">
            <input asp-for="@Model.width" class="form-control" placeholder="Image @Model.width" />
        </div>
    </div>
    <div class="form-group row">
        <div class="col-sm-10" style="max-width: 12rem;">
            <input asp-for="@Model.height" class="form-control" placeholder="Image @Model.height" />
        </div>
    </div>
<input type="submit" value="Generate QR Barcode" />
</form>

其他问题：

您不需要为asp-page 指定值，除非您是将表单发布到与其所在页面不同的页面。
您不需要为 asp-page-handler 指定值，除非您正在使用named handler method
"multipart/form-data" 的 enctype 值仅在以下情况下是必需的您正在上传表单
除非您打算接受，否则不应将 SupportsGet 设置为 true 在 GET 请求中传递的值。

【讨论】：