表格行内编辑要先决定“什么时候保存”和“保存失败后保留什么”,再画输入框。备注等低风险字段可考虑自动保存;金额、状态或相互关联的字段,更适合显式确认或整行保存。进入编辑、校验、提交、失败、撤销和冲突都应有明确反馈。
在墨刀原型设计中把同一条记录的编辑、保存、错误和冲突状态串起来,产品、设计和研发才能看到同一次操作的完整后果。

用订单表格确定编辑边界
以运营修改订单备注和配送日期为例:备注相对独立,配送日期却可能受订单状态、仓库排期和角色权限影响。先列字段规则,再判断行内编辑是否合适。需要填写很多关联信息、上传凭证或阅读风险说明的任务,可以转到详情面板,不必强行放进一格。
| 字段 | 编辑条件 | 保存方式 | 必须确认 |
|---|---|---|---|
| 备注 | 用户有编辑权限 | 可选择离开单元格保存 | 最大长度、是否允许空值 |
| 配送日期 | 订单仍可调整 | 显式保存较清楚 | 时区、可选日期范围、后续通知 |
| 订单状态 | 只允许合法迁移 | 确认后提交 | 权限、状态条件、不可逆动作 |
| 金额 | 按业务规则受控 | 独立确认或详情编辑 | 精度、币种、审批和审计要求 |
自动保存与显式保存如何选
自动保存减少点击,但必须区分编辑中、保存中和已保存;用户快速移动焦点时,旧请求不能覆盖后一次输入。显式保存便于检查多字段,但需要给出取消入口和离开前的未保存提示。无论哪种方式,界面上的成功反馈都应来自实际保存结果。
整行字段彼此关联时,一次提交能避免“日期成功、时间失败”的半完成状态;独立字段可以逐格保存,但每格都要清楚显示失败。保存触发方式应保持一致,不要同一列表里部分字段失焦即存、部分字段按 Enter 才存却没有说明。
七个状态对应七种反馈
| 状态 | 界面规则 | 恢复或下一步 |
|---|---|---|
| 可编辑 | 在悬停、聚焦或明确入口处显示可编辑提示 | 进入编辑 |
| 编辑中 | 显示输入边界与取消方式 | 确认、取消、移动焦点 |
| 校验失败 | 保留输入,错误与字段相邻 | 修正格式或范围 |
| 保存中 | 避免同值重复提交,显示进度 | 等待,不提前显示成功 |
| 保存成功 | 显示已保存并更新表格值 | 继续处理下一条 |
| 保存失败 | 保留用户草稿及原服务器值 | 重试或放弃 |
| 版本冲突 | 展示本地输入与最新服务器值 | 选择、重新编辑或取消 |

具体到键盘、焦点和离开页面
- 定义 Enter 是提交还是换行;多行备注可用明确的保存按钮,避免快捷键含义冲突。
- Esc 取消本次编辑并恢复原值;Tab 移动焦点时是否保存,应与自动保存策略一致。
- 筛选、排序、翻页前处理未保存内容,不能把正在编辑的行直接移走。
- 错误出现后焦点仍留在可修正的位置,提示不能只用颜色。
- 窄屏下优先保证输入、错误和保存按钮可见,复杂编辑可转到面板。
两个人同时修改,怎样保护双方内容
为订单附版本标识或修改时间,提交时由服务端判断是否仍是用户开始编辑时的版本。若冲突,显示“你的输入”和“当前记录”,允许用户复制草稿、重新编辑或取消。不要默认覆盖同事修改,也不要仅提示“保存失败”而丢掉输入。
网络中断与冲突是两种问题:前者可以在确认请求结果后重试,后者需要先取得最新值。若请求超时,先查询结果或使用项目既有的去重方案,避免重试产生重复业务动作。
一条配送日期规则如何写完整
规则不要只写“日期合法”。可以约定:只有未出库且有权限的订单可修改;日期按业务时区显示;不可早于允许发货日;取消恢复编辑前的值;保存失败保留草稿;其他人已修改时先展示最新日期。这里的具体条件由业务确认,设计稿负责把每个条件对应的反馈画清楚。
如果同一行的配送日期与时间段相互依赖,先选择日期再重新加载可用时间段,旧时间段无效时需要明确提示。此时整行保存往往更容易解释,不能让日期已经保存、时间段却仍是旧值。
四条可以直接交给测试的任务
| 任务 | 关键检查 |
|---|---|
| 修改备注后按 Esc | 恢复原值,不发起保存或不保留已取消草稿 |
| 填入不允许的日期并离开单元格 | 指出字段问题,保留输入,不显示成功 |
| 保存时断网后重新连接 | 保留草稿,确认请求结果后可恢复 |
| 另一人先改同一记录,再提交本地值 | 显示版本差异,未经用户选择不覆盖 |
验收记录要同时保留页面截图与实际数据结果。仅看到“已保存”提示不能证明服务器写入正确;同样,服务器已保存但界面仍显示旧值,也会导致用户重复修改。设计与研发需共同确认反馈的触发时点。
交付和验收用同一张规则表
记录字段名、可编辑角色、数据格式、空值、保存触发、错误文案和验收条件。测试至少使用正常值、边界值、非法值和冲突值,检查页面表现与服务器结果一致。只允许的字段可编辑,权限仍由服务端校验,不能因为前端隐藏按钮就认为安全。
最终交付包含字段规则、状态原型、焦点与快捷键约定、失败恢复、冲突处理和验证记录。产品确认业务边界,设计确认操作反馈,研发确认保存和并发策略,再安排实现。
可以在墨刀原型里只选“配送日期”一个字段,画出编辑、保存失败和版本冲突三个状态,请产品与研发沿着同一次修改走查;把保存规则定稳后,再扩展整张表格。