Django FloatField设置占位符与掩码后存库正常但表单回显错误

问题根因 #

你使用的data-mask要求输入格式为固定3位整数+1位小数的结构，但Django默认的FloatField回显数值时，会把小于100的数值输出为无前导零的字符串（比如78.1输出为"78.1"而非"078.1"），长度不符合mask规则，导致mask插件解析时丢失小数点，最终显示为781。

解决方案 #

方案1：自定义表单字段重写回显逻辑（最适配当前代码） #

自定义FloatField子类，在回显时自动将数值格式化为符合mask要求的带前导零的格式：

1. 在forms.py中新增自定义字段类：

class MaskedFloatField(forms.FloatField):
    def prepare_value(self, value):
        if value is None:
            return ""
        # 格式化规则：总长度5位，小数位1位，不足前补0，正好匹配000.0的mask规则
        return f"{value:05.1f}"

2. 替换原有表单字段的类：

self.fields['inc_poi'] = MaskedFloatField(
    label = 'Poids (kg)',
    widget=forms.TextInput(attrs={'placeholder': '000.0','data-mask':'000.0'}),
    required=False,
    disabled=DISABLED
)

方案2：替换为DecimalField（适合重量等精度要求高的场景） #

FloatField为二进制浮点数，存储小数存在精度丢失风险，重量类字段更推荐使用DecimalField：

1. 修改models.py字段定义：

# max_digits=4对应总位数4（3位整数+1位小数）
inc_poi = models.DecimalField('Poids (kg)', max_digits=4, decimal_places=1, null=True, blank=True)

2. 表单字段可复用方案1的自定义逻辑，将父类改为forms.DecimalField即可。

方案3：前端兼容（无需修改后端代码） #

如果不想调整后端逻辑，可通过JS在页面加载时补全前导零：

window.addEventListener('load', function() {
  const poiInput = document.querySelector('input[name="inc_poi"]');
  if (poiInput.value && poiInput.value.includes('.')) {
    const [intPart, decPart] = poiInput.value.split('.');
    poiInput.value = `${intPart.padStart(3, '0')}.${decPart.slice(0,1)}`;
  }
})

内容的提问来源于stack exchange，提问作者Mereva