用于货币前缀的C#MVC文本框

Bootstrap、HTML5或jQuery是否可以在输入字段中使用货币前缀作为显示元素，而不是实际输入值的一部分

例如，我希望在金额字段中显示550.00英镑，但数据显示为550.00英镑

我尝试过使用w2ui、jQuery Price Format和jQuery maskMoney，这三种格式基本上都做相同的工作，它们确实可以使用前缀或后缀，但它们实际上并不在输入中存储值，因此过账数据返回空值

Model.cs

[DisplayFormat(DataFormatString = "{0:F2}", ApplyFormatInEditMode = true)]
public double Amount { get; set; }

namespace WebApplication1.Models
{
    public class MyModelBinder : DefaultModelBinder
    {
        protected override object GetPropertyValue(ControllerContext controllerContext, ModelBindingContext bindingContext, System.ComponentModel.PropertyDescriptor propertyDescriptor, IModelBinder propertyBinder)
        {
            if (propertyDescriptor.ComponentType == typeof(MyModel))
            {
                if (propertyDescriptor.Name == "Amount")
                {
                    var obj = bindingContext.ValueProvider.GetValue("Amount");

                    return Convert.ToDouble(obj.AttemptedValue.Replace("£", ""));
                }
            }

            return base.GetPropertyValue(controllerContext, bindingContext, propertyDescriptor, propertyBinder);
        }
    }
}

[HttpPost]
public ActionResult Index([ModelBinder(typeof(MyModelBinder))]MyModel model)

HTML

<div class="col-sm-3">
    <div class="input-group">
        <span class="input-group-addon">Amount</span>
        @Html.TextBoxFor(m => m.Amount, new { @class = "form-control", @Value = @ViewBag.Amount, placeholder = "Amount", @Id = "Amount" })
    </div>
</div>

// Dynamically setting value of field
$('#Amount').val(data.Amount);

// w2ui example
$('#Amount').val(data.Amount).w2field('money', { moneySymbol: '£' });

// jQuery Price Format example
$('#Amount').val(data.Amount).priceFormat({
    prefix: '£'
});

$('#Amount').val(data.Amount).priceFormat({
    prefix: '£'
});

数量
@Html.TextBoxFor（m=>m.Amount，新的{@class=“form control”，@Value=@ViewBag.Amount，placeholder=“Amount”，@Id=“Amount”}）
//动态设置字段的值
$（'#Amount'）.val（data.Amount）；
//w2ui示例
$（'#Amount'）.val（data.Amount）.w2field（'money'，{moneySymbol:'英镑'}）；
//jQuery价格格式示例
$（'#Amount'）.val（data.Amount）.priceFormat({
前缀：‘’
});

我意识到我可以使用另一个字段来存储数值，但我有很多字段需要显示，这些字段最初是动态填充的，但可以被用户覆盖。因此，复制字段，一个用于显示输入，一个用于隐藏存储输入数据，似乎是过火了

---

任何帮助都将不胜感激：-）

我建议您在输入中加上一个span：

<span class="currency">£ @Html.TextBoxFor()</span>

£@Html.TextBoxFor（）

并用css修改它，使其格式适合您自己。比如

或者只是将其添加为标签：

<label for="currencyInput">Amount in £</label>

金额单位：

---

否则，您将无法在任何地方删除/添加前缀。将您的输入保留为实际值。

我建议将您的输入用span包装：

<span class="currency">£ @Html.TextBoxFor()</span>

£@Html.TextBoxFor（）

并用css修改它，使其格式适合您自己。比如

或者只是将其添加为标签：

<label for="currencyInput">Amount in £</label>

金额单位：

---

否则，您将无法在任何地方删除/添加前缀。将您的输入保持为实际值。

问题不在于任何jQuery库，而在于表单发布了一个字符串，而模型需要一个双精度字符串

因此，我实现了一个ModelBinder，以允许post的字符串数据包含“£”磅符号，并将其转换为double

MyModelBinder.cs

[DisplayFormat(DataFormatString = "{0:F2}", ApplyFormatInEditMode = true)]
public double Amount { get; set; }

namespace WebApplication1.Models
{
    public class MyModelBinder : DefaultModelBinder
    {
        protected override object GetPropertyValue(ControllerContext controllerContext, ModelBindingContext bindingContext, System.ComponentModel.PropertyDescriptor propertyDescriptor, IModelBinder propertyBinder)
        {
            if (propertyDescriptor.ComponentType == typeof(MyModel))
            {
                if (propertyDescriptor.Name == "Amount")
                {
                    var obj = bindingContext.ValueProvider.GetValue("Amount");

                    return Convert.ToDouble(obj.AttemptedValue.Replace("£", ""));
                }
            }

            return base.GetPropertyValue(controllerContext, bindingContext, propertyDescriptor, propertyBinder);
        }
    }
}

[HttpPost]
public ActionResult Index([ModelBinder(typeof(MyModelBinder))]MyModel model)

HomeController.cs

[DisplayFormat(DataFormatString = "{0:F2}", ApplyFormatInEditMode = true)]
public double Amount { get; set; }

namespace WebApplication1.Models
{
    public class MyModelBinder : DefaultModelBinder
    {
        protected override object GetPropertyValue(ControllerContext controllerContext, ModelBindingContext bindingContext, System.ComponentModel.PropertyDescriptor propertyDescriptor, IModelBinder propertyBinder)
        {
            if (propertyDescriptor.ComponentType == typeof(MyModel))
            {
                if (propertyDescriptor.Name == "Amount")
                {
                    var obj = bindingContext.ValueProvider.GetValue("Amount");

                    return Convert.ToDouble(obj.AttemptedValue.Replace("£", ""));
                }
            }

            return base.GetPropertyValue(controllerContext, bindingContext, propertyDescriptor, propertyBinder);
        }
    }
}

[HttpPost]
public ActionResult Index([ModelBinder(typeof(MyModelBinder))]MyModel model)

HTML

<div class="col-sm-3">
    <div class="input-group">
        <span class="input-group-addon">Amount</span>
        @Html.TextBoxFor(m => m.Amount, new { @class = "form-control", @Value = @ViewBag.Amount, placeholder = "Amount", @Id = "Amount" })
    </div>
</div>

// Dynamically setting value of field
$('#Amount').val(data.Amount);

// w2ui example
$('#Amount').val(data.Amount).w2field('money', { moneySymbol: '£' });

// jQuery Price Format example
$('#Amount').val(data.Amount).priceFormat({
    prefix: '£'
});

$('#Amount').val(data.Amount).priceFormat({
    prefix: '£'
});

---

我希望这对其他人有用。

问题不在于任何jQuery库，而在于表单发布了一个字符串，而模型预期是双精度的

因此，我实现了一个ModelBinder，以允许post的字符串数据包含“£”磅符号，并将其转换为double

MyModelBinder.cs

[DisplayFormat(DataFormatString = "{0:F2}", ApplyFormatInEditMode = true)]
public double Amount { get; set; }

namespace WebApplication1.Models
{
    public class MyModelBinder : DefaultModelBinder
    {
        protected override object GetPropertyValue(ControllerContext controllerContext, ModelBindingContext bindingContext, System.ComponentModel.PropertyDescriptor propertyDescriptor, IModelBinder propertyBinder)
        {
            if (propertyDescriptor.ComponentType == typeof(MyModel))
            {
                if (propertyDescriptor.Name == "Amount")
                {
                    var obj = bindingContext.ValueProvider.GetValue("Amount");

                    return Convert.ToDouble(obj.AttemptedValue.Replace("£", ""));
                }
            }

            return base.GetPropertyValue(controllerContext, bindingContext, propertyDescriptor, propertyBinder);
        }
    }
}

[HttpPost]
public ActionResult Index([ModelBinder(typeof(MyModelBinder))]MyModel model)

HomeController.cs

[DisplayFormat(DataFormatString = "{0:F2}", ApplyFormatInEditMode = true)]
public double Amount { get; set; }

namespace WebApplication1.Models
{
    public class MyModelBinder : DefaultModelBinder
    {
        protected override object GetPropertyValue(ControllerContext controllerContext, ModelBindingContext bindingContext, System.ComponentModel.PropertyDescriptor propertyDescriptor, IModelBinder propertyBinder)
        {
            if (propertyDescriptor.ComponentType == typeof(MyModel))
            {
                if (propertyDescriptor.Name == "Amount")
                {
                    var obj = bindingContext.ValueProvider.GetValue("Amount");

                    return Convert.ToDouble(obj.AttemptedValue.Replace("£", ""));
                }
            }

            return base.GetPropertyValue(controllerContext, bindingContext, propertyDescriptor, propertyBinder);
        }
    }
}

[HttpPost]
public ActionResult Index([ModelBinder(typeof(MyModelBinder))]MyModel model)

HTML

<div class="col-sm-3">
    <div class="input-group">
        <span class="input-group-addon">Amount</span>
        @Html.TextBoxFor(m => m.Amount, new { @class = "form-control", @Value = @ViewBag.Amount, placeholder = "Amount", @Id = "Amount" })
    </div>
</div>

// Dynamically setting value of field
$('#Amount').val(data.Amount);

// w2ui example
$('#Amount').val(data.Amount).w2field('money', { moneySymbol: '£' });

// jQuery Price Format example
$('#Amount').val(data.Amount).priceFormat({
    prefix: '£'
});

$('#Amount').val(data.Amount).priceFormat({
    prefix: '£'
});

---

我希望这对其他人有用。

感谢您的建议，我已经实现了解决问题的ModelBinder。感谢您的建议，我已经实现了解决问题的ModelBinder。