Input tag helper with currency format and POST action issue

[saf-itpro]

Following Input Tag helper is using asp-format attribute to display its value in currency format. But when posting the View to update data it returns that input value as null. Question: How can we remedy the above issue without using client side scripts (Ajax, etc.)?
View:

....
<form asp-controller="..." asp-action="..." method="post">
....
<td><input asp-for="cost" asp-format="{0:C}"/></td>
....
<button type="submit" name="submit" value="Add">Update Data</button>
</form>

[NTaylorMullen]

/cc @dougbu

[frankabbruzzese]

@saf-itpro ,
asp-format just changes the way a value is rendered, not the way it is bound by the model binder. When the form is submitted the model binder just receives all values contained in all inputs of the form, it doesn't receive any information about the chosen format.

In other words, it is your responsibility to ensure that the format used can be understood by the model binder.
Currency formats are not understood by the built-in model binder, so if you dont want to use javascript, the only other option remaining is to write a custom model binder for currency formats. Then you may specify to use your custom model binder by decorating either model properties or action method parameters with a ModelBinderAttribute with your custom model binder type as parameter.

Your custom model binder should mimic the out-of-the-box SimpleModelBinder, but should use a parse method with a currency format specified to convert the string received into a number (I suppose a decimal).

[saf-itpro]

@frankabbruzzese If using JavaScript, can we clear the format before submitting the data w/o using Ajax? I mean still submitting the data using regular POST but have the inputs clear the formatting using Javascript? If we can, do you happen to know, how? Our input values are decimal.

[frankabbruzzese]

@saf-itpro , I would avoid the problem by using Bootstrap input groups. This way you add the currency sign as an add-on, instead of inserting it in the input field.

[dougbu]

Thanks @frankabbruzzese. I agree Bootstrap or similar is the way to go.

[saf-itpro]

@frankabbruzzese Bootstrap input group input groups still displays the numbers w/o comma. For example, in our model the cost attribute value is 15904.35 and we would want to display in the input as $15,604.35 but the following bootstrap code is displaying as $15904.35.00 with $ and .00 outside the input control. Displaying $ outside input control is ok but we need to have , inside the input tag.

<div class="input-group">
  <span class="input-group-addon">$</span>
  <input asp-for="cost" type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
  <span class="input-group-addon">.00</span>
</div>

[frankabbruzzese]

You may add thousand separaor wirh a format attribute, by selecting an appropiate format. However model binder ar moment has a bug rhat should be fixed i forthcoming 2'0 See #5502 So at moment it doesnt recognize rhousands separator. If you cant wait you must install now a fix.

[Eilon]

The recommended solution here is to place the currency indicator outside of the editable field (e.g. before or after), and then when we fix #5502 it'll be easy to enable the editable field to have thousands/decimal separators.

As such, I'm closing this issue because we are not planning to make further changes in this area.