Отформатировать поле EditorFor() в качестве валюты при просмотре и редактировании?

Question

У меня есть EditorFor() на мой взгляд для поля [cost]:

<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 когда пользователь печатает.

Есть ли простой способ сделать это?

Я использую MVC5 Code-First с Bootstrap, и в своем исследовании я нашел несколько возможных вариантов для MVC3/4, но большинство из них кажется громоздким для реализации.

---

РЕДАКТИРОВАТЬ:

Я ищу способ отображения значения как currency как в моем EditorFor() и в пределах Grid.Mvc ( https://gridmvc.codeplex.com/) столбец для поля [cost]:

@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; }

В идеале хочу отобразить (напр.) Значение 1222345.47 как $1,222,345.47 всегда позволяя пользователю вводить значение в виде простого десятичного числа и при щелчке EditorFor() значение визуально отформатировано в currency формат.

Может кто-нибудь предложить способ пойти по этому поводу?

---

EDIT2:

Я получил EditorFor() правильное отображение значения с помощью строки пользовательского формата ниже:

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

Как упомянул Крис, я должен убрать ",", чтобы модель приняла значение как действительное - я полагаю, что могу это сделать, когда форма пытается опубликовать.

Все еще пытаюсь понять, как отобразить значение в моем MVCGrid в currency формат.

Answer 1

Это двусторонний ответ. Что касается просмотра данных, вы можете просто украсить свою собственность:

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

Или же

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

Будет работать так же хорошо.

Однако для редактирования значения все немного сложнее. DisplayFormat принимает параметр в дополнение к DataFormatString называется ApplyInEditMode, Установка этого в true, приведет к тому, что значение, отображаемое Razor, также будет в выбранном формате. Но, прежде чем вы уйдете и сделаете это, проблема в том, что объявленное значение, например, "$1,234,56", не сможет обрабатываться связывателем моделей как десятичное значение.

Для этого и для нужной вам функции форматирования по типу вы должны просто использовать JavaScript. Есть метрическая тонна плагинов JavaScript, которые могут форматировать входные значения. Просто Google что-то вроде "входное значение формата JavaScript", и вы должны получить больше результатов, чем вы хотели бы. Найдите тот, который работает для вас, и используйте его.

Answer 2

Я думаю, что редакторская часть вашего вопроса получила хороший ответ.

Сетка MVC позволяет форматировать десятичное число с помощью параметра.Format(), например:

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

Результат выглядит так: формат валюты в сетке