表格数据回填页面

作者：坚定的守猴

撰写时间：2019年7月21日

开发软件和关键技术：VS；查询指定回填字段

在项目里面，我们有时候新增的数据内容是一个整体，好比如在业务方面，新增一份单据，里面的有若干个合作客户资料的字段，对于这种情况的数据新增，我们一般都是获取上面基础数据进行回填，保证数据的完整性。也是通过表格数据回填，从中也是一种效率的提升。在此，我们了解一下这种方式背后的原理。

我们之前介绍过关于数据回填的内容，只不过那是结合表格数据修改。现在我们拓展一下，将表格数据回填到页面的指定字段。对比一下两者之间的区别。

表格数据修改的回填，是通过form表单的形式提交。而现在数据回填到页面的主要区别就在不通过表单的形式进行回填。下面我们来通过一个例子来实现这效果。

第一步，我们先来把控制器这边把需要回填数据的代码写好

上面是查询回填的数据（因为这是项目的一部分，可能查询数据数据较多，所以上面不仅仅只查询需要回填的页面数据）

这里是页面回填数据的字段，必须和页面的一致

从上面我们看出来，这和之前修改回填区别不大。在数据查询方面是大同小异，这主要还是在页面。现在我们到页面看一下JS代码

主要的核心就是在这里，一句话，在表格里面选中一条数据，然后就进行回填。就这么简单的一个功能。我们有时候习惯了数据修改的form表单回填，相对来说这可能会出现一种陌生感。可能这就是一个思维的转换。

简洁的代码，我们就来看一下效果。

点击按钮弹出模态框，选中其中的一条数据，然后点击确定。

表格里面的数据已成功回填到页面了。

关于这表格数据回填页面的内容就介绍到这里。