---
order: 4
navTitle: 提交数据
---
# 在SuperPage中提交数据

SuperPage提供了提交数据的功能，可以在页面上实现数据的增加、删除、修改、导入等操作。

## SuperPage提交数据的原理

下图描述了SuperPage提交数据的工作原理：

![](./images/pptx-image-submitData.png)

使用SuperPage提交数据，主要有图中所示的4个关键环节：

1. **可提交数据的容器组件**：在SuperPage中，容器组件只要内部放置了**输入组件**（如[输入框](../components/input/textinput.md)、下拉框），且**输入组件**绑定了提交字段，那么它就可以提交数据。可以把这样的容器组件理解为一个“表单”，比如一个SuperPage页面整体提交数据、一个SuperPage内部的[对话框](../components/embed/dialog.md)提交数据，或者是一个[面板](superpage/component/panel)组件提交自己面板内的数据。
2. **交互**：交互是一个动作，组件的动作需要通过交互实现，不同场景使用不同的交互。SuperPage支持多个提交数据的交互，如[提交表单](./action/submit-data.md)、[删除数据](./action/delete-data.md)、[导入数据](./action/import-data.md)等。**交互**设置需要有载体组件，一般使用[按钮](../components/common/button.md)。
3. **一个“可写”的数据集**：SuperPage页面的取数来源，也是提交数据对应的数据库表，需要在**数据**中引用并设置“可写”，具体可参考文档[引入数据](./datasourse.md)。
4. **提交**：这是一个可选的环节，通常用户可以在步骤二的**交互**中就直接通过**数据集**把数据提交入库了。但是有时候用户可能会在页面中反复多次修改数据并不提交，最后确认修改完成后再提交，此时需要使用两个**交互**，即在第二个步骤用“提交表单”或“删除数据”等交互并设置交互的**暂存**属性，**暂存**后所有的修改将自动保存在浏览器页面的数据集对象中，待步骤四的**提交交互**将数据入库。

## 各种提交数据的场景

- [新增数据](#insert)
- [修改数据](#update)
- [删除数据](#delete)
- [提交附件](#upload)
- [导入数据](#import-data)
- [对多表在一个事务中进行增删改](#multiple-operations)

### 新增数据{#insert}

新增数据即将数据**新增**到数据库中（此时如果数据同时被其他用户新增了，那么会出现主键冲突错误的提示），这里使用的**交互**为[提交表单](./action/submit-data.md)。初始化SuperPage页面或对话框时传递参数`:newData=true`，表示是新增数据。**提交表单**交互会自动识别这个参数，进行“新增”提交。根据不同的“表单”，向交互传递`:newData`的方法也不同：

- **SuperPage页面**：使用[打开链接](./action/linkto.md)交互链接到新页面，在参数中添加`:newData=true`
- **对话框**：使用[显示对话框/悬浮面板](./action/show-dialog.md)打开对话框时，在模式中选择**新数据**，系统自动向对话框传递`:newData`参数

### 修改数据{#update}

修改数据即对数据库内已有的数据进行**更新**。初始化SuperPage页面或对话框时应传递待修改数据的主键信息，**提交表单**交互会根据该主键进行“更新”提交。实际上**修改数据**和**新增数据**的操作基本类似，两者的区别在于传递的参数不同。传递主键信息的方法如下：

- **在对话框中进行修改**：**显示对话框/悬浮面板**交互的模式选择**加载数据**
- **在新的SuperPage页面中修改**：**打开链接**交互中设置主键参数，在新的页面接收参数并设置过滤条件

通过上述方式进入“表单”后，“表单”的输入组件中会自动显示绑定字段的数据内容，用户可在此基础上进行修改。

### 删除数据{#delete}

删除数据即对数据库内已有的数据进行**删除**，需要使用[删除数据](./action/delete-data.md)交互。常见应用场景如下：

- **列表**显示数据，在操作列中有删除按钮，点击可以删除该行数据；或者在列表前有勾选，删除所有勾选项
- 明确知道需要删除某个主键值的一条数据，如在新闻公告编辑界面，点击删除按钮，删除这一条数据

### 提交附件{#upload}

使用**附件**组件可以提交各种文件，如文档、图片、视频等。附件可以作为blob字段存储于数据库，也可以用文件形式存储于磁盘。将附件上传至数据库时需要使用[提交表单](./action/submit-data.md)交互，更多信息见[附件](../components/input/upload.md)组件说明。

### 导入数据{#import-data}

SuperPage支持以导入文件的方式将数据存入数据库，需要用到**导入数据**交互。文件模板可以事先上传到系统中，使用[打开链接](./action/linkto.md)交互下载模板，[导入数据](./action/import-data.md)交互将Excel内的数据存入至系统中。常用的上传方式如下：

1. **直接将数据导入目标表**：在**导入数据**交互中设置目标数据集
2. **先将数据导入到临时表，经过处理或确认后再复制到目标表**：需要使用两个数据模型，一个用来暂存用户上传的数据，一个用来存放最终数据。可以搭配[列表](../components/data/list.md)将暂存的数据展示出来，待所有修改操作结束后，使用[复制数据](./action/copy-data.md)交互将临时数据复制到最终所需的数据模型中

:::tip

提供模板的原因在于**导入数据**交互对导入的文件字段有一定的要求：

- 第一行必须为目标模型表的字段名称
- Excel中包含的字段与**导入数据**交互中设置的**更多字段**应包含模型表内所有字段。

:::

### 对多表在一个事务中进行增删改{#multiple-operations}

- **不同输入组件内容写入不同模型**：输入组件的**绑定字段**支持绑定不同模型表字段，**提交表单**交互中也可以选择多个数据模型
- **多次修改一次性提交**：即用户进行多次修改但不提交数据，待所有修改结束后再将数据提交入库。结合上文介绍的增删改操作，所用到的**提交表单**、**删除数据**交互均支持**暂存**，这些数据将被存在浏览器页面的数据集对象中，最后通过**提交表单**交互，将修改后的数据一次性存入数据库
- **同一份数据写入到多个模型表**：SuperPage的**输入组件**仅允许绑定一个字段，将该数据向多个模型表传递时，需要使用[更新数据](./action/update-data.md)交互。**更新数据**支持将指定组件的数据信息存入到指定模型表内，使用时可添加多个**更新数据**交互

## 提交前校验数据合法性{#validate}

**校验数据**即校验输入数据的合法性，一般有两种校验方式：

- **前端校验**：输入组件自带校验功能，校验失败时可在组件下方显示提示信息，需要在**校验**属性中设置，可参考文档[文本输入-校验](../components/input/textinput.md#validate)
- **后端校验**：当多个页面的数据都需要向同一张模型表中提交，且数据的校验规则相同时，可使用[数据校验](https://docs.succapp.com/v5/data-gov/data-audit)

若希望在提交前校验输入的内容是否符合规范，需要在**提交表单**或其他提交类交互动作中勾选**校验数据**，勾选后将优先进行**前端校验**，**前端校验**通过后进行**后端校验**，当且仅当两种校验都通过时，数据才能存入至数据库中。若不勾选**校验数据**，则不会进行数据提交的校验，此时仅在填写**表单**时，**输入组件**进行简单的前端校验。

:::tip

**模型校验**的规则也可以在**输入组件**中体现，需要在**模型表设置**>**权限**中**启用模型上的校验规则**，当校验失败后，**模型校验**中设置的提示信息将在组件下方显示出来。

:::

## SuperPage提交数据的安全控制{#security}

实际业务中，数据库中的数据是不能随意修改的，在使用SuperPage提交数据时，建议做一些安全控制。SuperPage和系统权限管理都提供了相应的处理机制：

- **页面读写的权限**：页面的读写权限决定了登录用户在系统中是否可以访问该SuperPage页面及查看的数据范围，具体介绍可参考文档[权限管理](../../../permission/grant/README.md)。
- **数据集限制数据的修改范围**：在SuperPage内部可以对数据模型进行提交数据的各项限制，一方面包括该数据模型是否能够进行读写操作、字段是否能够修改等，一方面针对用户是否拥有对该数据集读或写、删除数据等的权限。具体介绍可参考文档[引入数据](./datasourse.md#数据集权限设置)。

## 记录数据提交的日志{#log}

todo，产品还未支持

## SuperPage提交数据与表单区别{#difference}

- 报表填报应用专注于固定周期报送和Web填报，如省市区县三级的层层上报数据、分子公司为集团定期上报经营数据等
- SuperPage的提交数据适用于带有业务流程的应用场景