我有一个在左侧使用 jQuery 选项卡的页面。
大约有 8 个选项卡,每个选项卡内都有表格,每个选项卡内的每个表格上大约有 10-20 个项目。
如何以及显示“保存”按钮或某些标识的最佳方式是每个选项卡上的表单上的项目正在保存?
保存按钮需要保存所有选项卡上的所有字段,但不确定在屏幕上呈现此内容的最佳方式,以获得最佳用户体验。
我有一个在左侧使用 jQuery 选项卡的页面。
大约有 8 个选项卡,每个选项卡内都有表格,每个选项卡内的每个表格上大约有 10-20 个项目。
如何以及显示“保存”按钮或某些标识的最佳方式是每个选项卡上的表单上的项目正在保存?
保存按钮需要保存所有选项卡上的所有字段,但不确定在屏幕上呈现此内容的最佳方式,以获得最佳用户体验。
如果您有一个包含许多项目的选项卡,您可能希望在顶部和底部放置一个保存按钮。
此外,我认为让这些保存按钮中的任何一个保存多个选项卡都是一个坏主意。如果我在 4 个不同的选项卡中进行更改,然后在第 5 个选项卡上单击“保存”,并且出现验证错误,您将遇到五分钱的情况 - 用户将不得不单击所有选项卡才能找到它们.
更好的方法是让每个选项卡都包含自己的表单,您可以方便地显示该选项卡的验证消息。
从用户的角度考虑这一点,您是否不讨厌做出一堆更改却只显示半打错误消息,然后必须单击每个选项卡来修复它们?
我同意尼克的观点。与带有单个保存按钮的一系列选项卡相比,使用向导样式布局而不在每个步骤中进行验证可能是一个更好的主意。每个步骤都有一个后退和下一步按钮,并且每次您单独为该步骤点击下一步时都会进行验证。最后一步有一个保存按钮而不是下一步按钮。此外,在后退和下一步按钮之间,您有一个进度条,显示用户在进程中的位置。
我已经构建了这样的 UI,并且我发现它们在很多用例中都能很好地工作。