HTML 将输入字段绑定到模型时不显示输入字段占位符

Question

我有一个输入字段，用户可以在其中输入价格。我希望有一个 0.00.

的占位符

仅当我删除模型绑定时占位符才有效：asp-for="Postage"

为什么会这样？以及如何显示占位符？

HTML 输入字段：

@model Website.Models.Game

<div class="form-group">
   <label asp-for="Postage"></label>
   <div class="input-icon">
      <input type="number" class="form-control postageInput" placeholder="0.00" asp-for="Postage"/>
      <i>£</i>
   </div>
</div>

模特：

public class Game {
  [Key]
  public int Id {get; set;}

  [Required(ErrorMessage = "Enter postage amount or click on 'collection only'")]
  public decimal Postage {get; set;}

  [other properties here below...]
}

Answer 1

占位符在输入值为空时显示。由于小数始终具有默认值，因此它不能为空。将模型上 Postage 属性的类型更改为可为 null 的小数将解决此问题。

试试下面的代码看看有什么不同。

HTML:

<div class="form-group">
    <label asp-for="Postage"></label>
    <div class="input-icon">
        <input type="number" class="form-control postageInput" placeholder="0.00" asp-for="Postage" />
        <i>£</i>
    </div>
</div>
<div class="form-group">
    <label asp-for="PostageNullable"></label>
    <div class="input-icon">
        <input type="number" class="form-control postageInput" placeholder="0.00" asp-for="PostageNullable" />
        <i>£</i>
    </div>
</div>

型号：

public decimal Postage { get; set; }

public decimal? PostageNullable { get; set; }

HTML 将输入字段绑定到模型时不显示输入字段占位符

HTML input field placeholder not displaying when binding input field to model

html

c#

model-binding

asp.net-core

razor-pages