在查看和编辑期间将 EditorFor() 字段的格式设置为货币

Question

我有一个字段[cost]的EditorFor()：

<div class="form-group">
        @*@Html.LabelFor(model => model.cost, htmlAttributes: new { @class = "control-label col-md-2" })*@
        <span class="control-label col-md-2">Cost:</span>
        <div class="col-md-10">
            @Html.EditorFor(model => model.cost, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.cost, "", new { @class = "text-danger" })
        </div>
    </div>

我想做的是在查看此值(单个记录、内部网格等(时用$显示此值，并在用户在字段中输入值时进行格式化。例如，键入12345时，我希望该值在用户键入时自动显示为12,345。

有没有简单的方法可以做到这一点？

我正在使用带有 Bootstrap 的 MVC5 Code-First，在我的研究中，我发现了 MVC3/4 的几个可能选项，但其中大多数似乎很难实现。

---

编辑：

我正在寻找一种方法，在我的EditorFor()和字段[cost]的Grid.Mvc(https://gridmvc.codeplex.com(列中将值显示为currency：

@try
{
    @Html.Grid(Model).Columns(columns =>
    {
        columns.Add().Encoded(false).Sanitized(false).RenderValueAs(o => @<a href="/INV_Assets/Edit/@o.Id" class="btn btn-primary btn-sm noDecoration"><span class="glyphicon glyphicon-pencil"></span> @*Edit*@</a>).SetWidth(15);
        columns.Add().Encoded(false).Sanitized(false).RenderValueAs(o => @<a href="/INV_Assets/Delete/@o.Id" class="btn btn-danger btn-sm noDecoration"><span class="glyphicon glyphicon-remove-circle"></span> @*Delete*@</a>).SetWidth(15);
        columns.Add().Encoded(false).Sanitized(false).RenderValueAs(o => @<a href="/INV_Assets/Details/@o.Id" class="btn btn-default btn-sm noDecoration"><span class="glyphicon glyphicon-eye-open"></span> @*View*@</a>).SetWidth(15);
        columns.Add(o => o.Status.status_description).Titled("Status").RenderValueAs(o => o.Status.status_description).Sanitized(false).Encoded(false).Sortable(true).Filterable(true).SetWidth(20);
        columns.Add(o => o.Location.location_dept).Titled("Dept").RenderValueAs(o => o.Location.location_dept).SetWidth(20);
        columns.Add(o => o.Location.location_room).Titled("Room").RenderValueAs(o => o.Location.location_room).SetWidth(20);
        columns.Add(o => o.owner).Titled("Owner").RenderValueAs(o => o.owner).SetWidth(20);
        columns.Add(o => o.Type.type_description).Titled("Type").RenderValueAs(o => o.Type.type_description).SetWidth(20);
        columns.Add(o => o.Manufacturer.manufacturer_description).Titled("Manufacturer").RenderValueAs(o => o.Manufacturer.manufacturer_description).SetWidth(20);
        columns.Add(o => o.Model.model_description).Titled("Model").RenderValueAs(o => o.Model.model_description).SetWidth(20);
        columns.Add(o => o.Vendor.vendor_name).Titled("Vendor").RenderValueAs(o => o.Vendor.vendor_name).SetWidth(20);
        columns.Add(o => o.description).Titled("Desc").RenderValueAs(o => o.description).SetWidth(20);
        columns.Add(o => o.asset_tag_number).Titled("Asset Tag #").RenderValueAs(o => o.asset_tag_number).SetWidth(20);
        columns.Add(o => o.serial_number).Titled("Serial #").RenderValueAs(o => o.serial_number).SetWidth(20);
        columns.Add(o => o.ip_address).Titled("IP Addr").RenderValueAs(o => o.ip_address).SetWidth(20);
        columns.Add(o => o.mac_address).Titled("Mac Addr").RenderValueAs(o => o.mac_address).SetWidth(20);
        columns.Add(o => o.po_number).Titled("PO #").RenderValueAs(o => o.po_number).SetWidth(20);
        columns.Add(o => o.invoice_number).Titled("Inv. #").RenderValueAs(o => Convert.ToString(o.invoice_number)).SetWidth(20);
        columns.Add(o => o.cost).Titled("Cost").RenderValueAs(o => "$" + Convert.ToString(o.cost)).SetWidth(20);
        columns.Add(o => o.note).Titled("Note").RenderValueAs(o => o.note).SetWidth(20);
        columns.Add(o => o.acquired_date).Titled("Acq. Date").RenderValueAs(o => Convert.ToString(o.acquired_date)).SetWidth(20);
        columns.Add(o => o.disposed_date).Titled("Disp. Date").RenderValueAs(o => Convert.ToString(o.disposed_date)).SetWidth(20);
        columns.Add(o => o.created_date).Titled("Crtd. Date").RenderValueAs(o => Convert.ToString(o.created_date)).SetWidth(20);
        columns.Add(o => o.created_by).Titled("By").RenderValueAs(o => o.created_by).SetWidth(20);
        columns.Add(o => o.modified_date).Titled("Mod. Date").RenderValueAs(o => Convert.ToString(o.modified_date)).SetWidth(20);
        columns.Add(o => o.modified_by).Titled("By").RenderValueAs(o => o.modified_by).SetWidth(20);
    }).WithPaging(10).Sortable().Filterable().WithMultipleFilters();
}
catch (NullReferenceException ex)
{
    return;
}

我已经在我的模型中将[cost]定义为decimal，但网格要求该值为string。我认为这个Convert.ToString()是使注释[DataType(DataType.Currency)]和[DisplayFormat(DataFormatString="{0:C}", ApplyFormatInEditMode=true)] public decimal cost { get; set; }生效？

 [DataType(DataType.Currency)]
 [DisplayFormat(DataFormatString="{0:C}", ApplyFormatInEditMode=true)]
  public decimal cost { get; set; }

理想情况下，希望始终将值显示为$1,222,345.47 1222345.47，让用户以纯小数形式输入值，并在单击离开EditorFor()时将值直观地格式化为currency格式。

谁能提供一种方法来解决这个问题？

---

编辑2：

我得到了使用以下自定义格式字符串正确显示值EditorFor()：

[DisplayFormat(DataFormatString = "{0:#,###0.00}", ApplyFormatInEditMode=true)]

正如 Chris 所提到的，我必须去掉"，"，以便模型接受该值为有效 - 我相信当表单尝试发布时我可以这样做。

仍在尝试弄清楚如何以currency格式在我的MVCGrid中显示值。

Answer 1

这是一个

双管齐下的答案。就查看数据而言，您可以简单地用以下方法装饰您的财产：

[DisplayFormat(DataFormatString = "{0:C}")]
public Decimal cost { get; set; }

或

[DataType(DataType.Currency)]
public Decimal cost { get; set; }

也会工作。

但是，对于编辑值，事情有点复杂。 除了DataFormatString之外，DisplayFormat还接受一个名为 ApplyInEditMode 的参数。将其设置为 true ，将导致 Razor 呈现的值也采用所选格式。但是，在您跑掉并执行此操作之前，这里的问题是，模型绑定器无法将诸如"$1,234.56"之类的已发布值作为十进制值进行处理。

对于这个和你想要的随类型格式化功能，你应该简单地使用 JavaScript。有一公吨的JavaScript插件可以格式化输入值。只需谷歌一下"javascript格式输入值"之类的东西，你应该得到比你想要的更多的结果。找到一个适合你的并使用它。

Answer 2

我认为您问题的编辑器部分已经得到了很好的回答。

网格 MVC 允许您使用 .格式(( 选项如下所示：

columns.Add(model => model.Cost).Titled("Cost PA").Format("£{0:#,###0.00}").SetWidth(10); columns.Add(model => model.CoTermDays).Titled("Days").SetWidth(10);

结果如下所示：网格中的货币格式