Question

我有一个很大的形式，它只是jQuery的本机网络内容。它有很多字段，例如200个，我们会定期添加和删除字段。我要求所有数字以逗号作为千位分隔符，并且要求日期始终以本地化格式显示。

现在，现在将以原始格式显示：10000000。目标是在输入中显示10,000,000。

我希望不要触摸服务器端代码来进行数据库更新，因此将所有逻辑保留在JavaScript中。用户输入的信息太多，但是一旦输入完毕，它可能会用逗号显示任何数字。 toLocalizedString通常可以做到这一点。然后问题来了：提交表单时，我需要从数字中删除所有逗号。

我开始捕获输入事件，检查其中是否有数字，并添加逗号。然后，在提交时，我需要一个例程来删除逗号，但前提是它们必须由我的程序放入。

我觉得以前我已经看过这样的功能，但是我还没有找到理想的解决方案。数据的源格式和显示给用户的格式之间需要分叉。我希望能够仅向用户显示其数据表示而无需实际更改单元格中的数据。不确定是否可能。

我当时想可能对此问题有一些优雅的解决方案。

Answer 1

执行此操作的通用方法是拥有一个具有实际（类型化）值（例如数字）的模型，以及一个具有格式化显示字符串的视图模型。

例如。（伪代码）：

class Model {
    value: number
}

class ViewModel {
    value: string
}

class ViewModelMapper {
    toModelView(model: Model): ModelView {
    }
    toModel(modelView: ModelView): Model {
    }
}

从服务器加载数据时，您需要进行从模型到视图模型的转换，然后再保存到服务器。您将使用视图模型在UI中显示数据，并使用该模型与后端进行通信。

您可以使用现有的输入掩码库，这些库已经在按照这些方式进行操作。例如，看到类似jQuery-Mask-Plugin之类的东西。

这个问题有点笼统，也许您想添加一些具体细节。

用于更漂亮数据的表单输入掩码

1 个答案: