ARTS Share6 miniUI getData(true,false)获取form表单数据问题

约定不等于承诺〃 2022-01-31 02:34 431阅读 0赞

昨天在写报表新增画面的时候，遇到一个问题，首次新增是完全成功的，而且新增后新增画面会自动刷新，将新增的数据显示到画面，然后可以进行修改，然后对数据保存。

流程：

1.  新增一条数据
2.  点击保存按钮，数据库`insert`一条数据
3.  画面自动刷新，新增数据显示在画面上
4.  可以对数据进行修改，点击保存

问题：当第二次点击保存的时候，本来应该是对前一次新增的数据进行更新，但是我发现数据库里面多了一条数据，然后开始查找原因

具体步骤：

1.  后台保存方法打断点，进行`DEBUG`,发现新增一条数据后，刷新画面，的确是将这条数据的主键值带到画面并且隐藏了
2.  修改数据，再次点击保存，（本来应该是走修改分支），实际发现因为后台获取到的主键值是`null`,所以又走了新增分支，因此导致数据库多了一条数据
3.  问题明确了：前端传值的时候并没有将画面隐藏的主键传过来
4.  前端`debug`，在保存的时候使用`var data = form.getData(true,false);`，发现`data`中并不存在`key`为`id`的属性，所以根本原因就出现在这里
5.  去`miniUI`官网查看了一下`API`，发现`mini`的`form`提交方式，是根据`mini`控件的`name`来获取`key`和`value`的，然后我去查看了一下我的隐藏域，发现`<input id ="id" visible="false" class="mini-textbox" value="${bo.id}"/>`里面没有写`name`属性
6.  最后增加了`name`属性，发现问题解决了。

总结，在使用`miniUI`的`form`进行提交数据保存的时候，需要注意以下几点:

1.  你的表单必须有一个`id`，然后你才可以如下所示的写代码：

var form = new mini.Form("#" + formId);
    form.validate();
    if (form.isValid() == false) return;
    //提交数据
    var data = form.getData(true, false);

1.  `form`提交获取数据是通过`mini`控件的`name`将其封装为一个对象进行提交。

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzQzMjU_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzQzMjU_size_16_color_FFFFFF_t_70]: /images/20220131/10d7f11443fa4888862e16c55669a011.png