首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

用户不填表?那是因为你没用好这7个设计准则

无线端表单设计需注意的原则有如下7个: 原则 1:表单的交互设计应与用户输入数据的行为强兼容 确保表单所有字段没有被界面的任意元素遮挡,例如键盘唤起时。...因此,尽量减少打字和防止用户输入错误,下面是几个小技巧: 智能缺省选项 智能缺省选项可让用户的表单输入完成更快,准确。例如,根据其地理位置数据提前帮助用户选择用户的地理位置信息。 ?...最低/最高区间的选择可考虑使用滑块交互 如果是在一个区间去选择选项可考虑使用滑块方式,用户只需要在一个设定的最低和最高之间移动滑块就可以,和传统下拉菜单相比大大地降低了输入成本。...原则 3:表单字段标签要么放置在字段上部要么使用浮动标签 字段标签告知用户这个字段的目的,清晰易懂的字段标签是让界面交互性提升的一个主要手段。...如果正在要求用户输入的数字信息(诸如电话号码)转换成一种形式,是柔性的,和设计的屏幕,可以解释多个输入格式和显示的方式,很容易可扫描的信息(人类,而不是机器)为了防止出错。不要使用固定的输入格式。

1.8K60

【摸鱼神器】UI库秒变低代码工具——表单篇(一)设计

表单控件的基础需求: 可以依赖 JSON 渲染。 依赖 JSON 创建 model。 便于用户输入数据。 验证用户输入的数据。 便于程序员实现功能。 可以多列。 可以分栏。 可以自定义扩展。 其他。...json 文件) /** * 表单控件的属性 */ export interface IFromProps { /** * 表单的 model,对象,包含多个字段。...*/ moduleId: number | string, /** * 表单编号,一个模块可以有多个表单 */ formId: number | string, /*...,一个模块可以有多个表单 colOrder 数组形式,表单里包含哪些字段?...其实也比较简单,还是做一个key-value ,字段作为key,需要显示的字段ID集合作为value。这样就可以了。

2.4K10
您找到你想要的搜索结果了吗?
是的
没有找到

​第 07 篇:创作后台开启,请开始你的表演!

在支持 Markdown 语法部分中将介绍如何在文章插入图片的方法。...如下图所示: 其次是新增 post 页面的表单,各个字段的 label 由定义在 Post 类的 Field 名转换而来,比如 Post 模型定义了 title 字段,则对应表单的 label 就是...文章的创建时间和修改时间应该根据当前时间自动生成,而现在是由人工填写,还有就是文章的作者应该自动填充为后台管理员用户,那么这些自动填充数据的字段就不需要在新增文章的表单中出现了。...modified_time', 'category', 'author'] fields = ['title', 'body', 'excerpt', 'category', 'tags'] 这里 fields 定义的字段就是表单展现的字段...所以这里问题的关键是每次保存模型时,都应该修改 modified_time 的。每一个 Model 都有一个 save 方法,这个方法包含了将 model 数据保存到数据库的逻辑。

1.1K20

VBA表单控件(一)

大家好,Excel的控件是放置在窗体的一些图形对象,可以用来显示、输入数据或者执行操作等。包括命令按钮、数值调节钮文本框、列表框、单选框、复选框等。...可以在开发工具选项卡的插入功能,可以看到两种控件。 在Excel工作表主要使用表单控件,它不仅与早期Excel版本兼容,而且使用相对简单,下面将分两节介绍常用的表单控件。...控件的属性在后面介绍的其他表单控件都可以同样的设置,后面介绍的控件就不再多做说明。 二、 数 调 节 钮 数值调节钮控件,功能字面意思,可以用于调整数值。...设置最小和最大值得范围,以及所需要的步长(即每次调整的大小)。选择单元格链接,即显示最终值的单元格。 示例设置为0-100的范围步长为1,显示单元格为C2单元格。...设置单元格链接,即显示值得单元格为C2单元格,然后设置数值范围的最小和最大,以及步长和页步长。两者的区别是,步长是点击两个上下箭头时数值的变化大小。而页步长是移动中间滑块时数值的变化大小。

4.9K30

100 个常见的 PHP 面试题

想象一下,当用户单击「提交到帖子」表单时,表单上有一个名为「var」的表单字段,然后您可以像这样访问: 1 $_POST["var"]; 36) 如何检查给定变量的为数字?...** 会话是一个逻辑对象,使我们能够跨多个PHP页面保留临时数据。 ** 65)如何在PHP启动会话?** 使用session_start()函数可以激活会话。 ** 66)如何传播会话ID?...在每次迭代,expr2 都会被评估。 如果评估结果是 TRUE, 循环继续, 并执行 for 的语句。 如果评估结果是 FALSE, 循环结束。expr3 在每次迭代结束时进行测试。...可以使用会话,cookie 或隐藏的表单字段在 PHP 页面之间传递变量。...除非您已经对数据进行了分区,否则有必要知道从哪个实例获取数据或将数据放入哪个实例。 102) 解释你对PHP进行更改时如何更新Memcached?

21K50

有了这个开源项目,不会 Web 开发也能让数据“动”起来!

2.2.3 显示数据表 Streamlit 能从多个不同角度快速、交互地可视化数据,原始数据、图表、JSON 数据等皆可。...:漂亮的按钮、滑块输入框等小部件。每次用户与小部件交互时,Python 脚本都会重新执行,并且该小部件的输出会在运行期间设置为新。 1、按钮 button。...当我们给函数打上 cache 标记时,Streamlit 在碰到该函数的时候会检查三个:函数名称、函数体、输入参数。如果发现这三个的组合第一次出现,则会运行函数,并且将结果存储在本地缓存。...2、表单 st.form():将元素与“提交”按钮一起处理。...# 向表单插入元素 with st.form("my_form1"): st.write("我在 1 框框里~") slider_val = st.slider("框框滑块")

2.2K30

react20道高频面试题答案总结

如果需要渲染多个 HTML 元素,则必须将它们组合在一个封闭标记内,例如 、、 等。此函数必须保持纯净,即必须每次调用时都返回相同的结果。...而在存在期的5个阶段,又不能确保生命周期方法一定会执行(通过 shouldComponentUpdate方法优化更新等)。在销毀期,组件即将被销毁,请求数据变得无意义。...如下所示, username没有存储在DOM元素内,而是存储在组件的状态每次要更新 username时,就要调用 setState更新状态;每次要获取 username的,就要获取组件状态。...表单如何呈现由表单元素自身决定。如下所示,表单并没有存储在组件的状态,而是存储在表单元素,当要修改表单数据时,直接输入表单即可。有时也可以获取元素,再手动修改它的。...主要原因是,约東性组件支持即时字段验证,允许有条件地禁用/启用按钮,强制输入格式等。

3.1K10

深入讲解 ASP+ 验证

我们研究了大量的数据输入表单,试图找到可以适用于尽可能多的表单的一种解决方案。我们发现,数据输入表单具有许多有趣的特性: 尽管错误信息或图标经常与输入元素相邻,但是它们几乎总是位于表的不同单元格。...最重要的是,此时会将验证器引用的所有输入元素“挂接”。被引用的输入元素将修改其客户端事件,以便在每次输入改时调用验证例程。 脚本库的代码将在用户使用 tab 键在各字段之间切换时执行。...某个独立的字段改时,将重新评估验证条件,根据需要使验证器可见或不可见。 当用户尝试提交表单时,将重新评估所有验证器。如果这些验证器全部有效,表单将提交给服务器。...因为在每次输入改时或提交时会执行客户端验证控件,所以在客户机上通常会评估这些验证控件两次或两次以上。请注意,提交后,仍将会在服务器上对这些验证控件进行重新评估。...输入字段转换成所需数据类型并进行比较。 第三步看起来有些不符合直觉。之所以这样评估,是因为如果验证器同时检查多个字段的有效性,很难为该验证器写出有意义的错误信息。

5.3K10

在 jQuery Mobile 中使用 UI 组件

例如,如果您有一个员工姓名列表,并且您将一个搜索筛选器栏添加到该列表,用户就能够通过向搜索筛选器文本输入键入一个或多个字符,来筛选和缩小在该页面上显示的结果范围。...使用 jQuery Mobile 进行文本输入,基本上也与原生文本输入相同;然而,您可以使用新的 HTML5 输入类型, email、tel 和 number。...要创建任何这些表单元素,您只需要将输入类型设置为其中一个这里所提及的。如需了解 HTML5 输入类型的完整列表,请参阅 参考资料。 除了所支持的 HTML5 输入类型之外,您还可以创建一个滑块。...滑块包括一个图柄和一个供图柄在上面滑动的槽 。随着图柄的移动,滑块被存储起来,然后,在表单被提交时,该也被提交。...清单 14 显示了一个滑块元素示例,其 max 为 10,min 为 0,默认的 value 为 2。 清单 14.

8K20

Unity基础教程系列(七)——可配置形状(Variety of Randomness)

因此,在SpawnZone定义一个可序列化的SpawnConfiguration结构类型,并将相关字段以及枚举类型放入其中,并删除其前缀。然后,SpawnZone仅需要单个生成配置字段。 ?...除此之外,还可以一起声明多个标签,case1:case2:DoAB();break; 等于if(x == 1 || x == 2){DoAB(); }。也可以使用goto跳转到另一种情况。...如果它们是简单的float字段,那么我们可以使用Range属性在编辑器强制执行此操作,将输入字段转换为滑块。 ? ? (范围的属性没有生效) 但这没有生效,因为Range仅适用于float或int。...这可能不是问题,因为颜色不需要精确,但是它使得无法检查要复制的一个滑块以用于其他地方。因此,我们也为最小和最大添加常规输入字段。...首先使用EditorGUI.FloatField绘制一个最小的float输入字段,不带标签。它返回可能更改的。之后是滑块,然后是最大输入字段。 ? ?

2.6K30

JavaScript 编程精解 中文第三版 十八、HTTP 和表单

后面是多个名称和,这些名称和分别对应form输入字段的name属性和这些元素的内容。&字符用来分隔不同的名称对。 在这个 URL ,经过编码的消息实际原本是"Yes?"...一个网页表单在其标签包含若干个输入字段。HTML 允许多个的不同风格的输入字段,从简单的开关选择框到下拉菜单和进行输入字段。...聚焦 不同于 HTML 文档的其他元素,表单字段可以获取键盘焦点。当点击或以某种方式激活时,他们会成为激活的元素,并接受键盘的输入。 因此,只有获得焦点时,你才能输入文本字段。...禁用字段 所有的表单字段都可以通过其disable属性来禁用。它是一个可以被指定为没有的属性 - 事实上它出现在所有禁用的元素。...change事件不会在每次输入时都被调用,而是在内容在改变并失焦后触发。为了及时的响应文本字段的改变,则需要为input事件注册一个处理器,每当用户有输入或更改时就被触发。

3.8K20

何在受控表单组件上使用 React Hooks

在使用 Hooks 实现了一个准系统表单之后,我同意了他们的观点。 让我们首先在有状态组件写一个简单的表单,我们将使用 Hooks 重写该表单,你可以决定喜欢哪种。...这就是在 React 实现受控表单的"老派"方式。 注意设置状态所需的样板文件的数量,以及在每次输入改时更新状态的方法。 让我们使用 React Hooks (终于到了!)...因为这是一个函数组件,所以我们没有 setState 来帮助我们修改状态变量的。 我们只有 setFirstName,它的唯一目的就是在每次调用它时更新 firstName。...现在我们知道了如何在函数组件创建状态变量以及如何更新它。 下面让我们继续解释代码的其余部分。 在第一个输入标记,我们将其设置为在组件顶部声明的状态变量。...通过尝试在表单输入文本来检查一切是否正常工作。 如果一切正常,恭喜你,你刚刚使用了一个React Hook。 如果没有,那么再看一遍本教程,确保你没有跳过任何说明。 添加你认为合适好看的样式。

59220

iOS 9人机界面指南(四):UI元素(下)- 腾讯ISUX

倒计时器模式展示了小时和分钟。你可以精确地设定总共的倒计时间,倒计时的最大为23小时59分钟。 使用日期时间选择器来让用户选择时间,而不是让用户自己输入一个包含了日期、时间等多个部分的时间。...选择器: 是日期时间选择器的通用模式 包括一个或多个滑轮,每个滑轮含有一组 当前选中的在中间,以深色标识 不可以自定义大小(选择器的大小与iPhone的键盘相同) 使用选择器可以让用户容易从一系列不同的中间进行选择...API提示: 想要了解更多如何在代码定义滑块,可以参考 Sliders 滑块: 由一条水平的轨迹和一个Thumb(滑块中支持用户水平拖拽的圆形控件)组成 左边和右边支持使用自定义图片来表述相对的最小与最大的含义...文本框 高度固定,包含圆角 当用户点击它时,自动唤起输入键盘 可以包含系统提供的按钮,书签按钮(Bookmarks) 可以展示多种文字样式(了解更多请参考 UITextView) 使用文本框来获取用户输入的少量信息...举例来说,你希望用户能方便地输入网址、密码或者电话号码。iOS提供了各种不同的键盘类型,以便用户输入不同类型的文本。

13.2K30

Swift3.1动画之Core Image

核心图像滤镜也可以链接在一起,以一次将多个效果应用于图像或视频帧。多个滤波器被组合成应用于图像的单个滤波器。与通过每个过滤器一次处理图像相比,这样做非常有效。...如果要使用滑块来更新过滤器,就像在本教程中所做的那样,每次更改过滤器时都会创建一个新的CIContext将太慢了。 我们这样做是正确的。...但在下一节,您将看到为什么这对于性能很重要,因为您实现了动态修改过滤器的功能! 更改过滤器 下面增加滑块每次滑块改时,都需要使用不同的重做图像过滤器。...您在方法传入浮点以设置深色效果的强度。该将由滑块提供。 2、设置一个过滤器,创建一个如下所示的随机噪声模式: ?...您正在使用滑块来设置此效果的半径和强度。 7、返回最后一个过滤器的输出。

1.4K80

表单怎么关不掉?揭密VFP对象引用的魔术

比如,现在我们有一个表单form1,表单上有一个页框pageframe1,页框的第一页上有一个表格grid1,现在,我要把第一列的标题设置为“第一列”,把背景色设置为灰色,正常情况下,我们不得不输入长长的对象层次...继续使用前面的例子,不过要把上述代码的Local改为Public,然后把这些代码放入表单的Init方法中去,运行这个表单后关闭它,看看发生了什么。   “表单关不掉了!是不是死机了?...而在下方的oColumn变量则不同,它的类型为“O”,却是“对象”!   原因:任何在表单建立的Public变量在表单释放时都不会自动被释放。   ...“1—模式”),像表单1那样放上3个文本框,给表单建立一个自定义属性oFrm1Cust,在表单的 Init事件输入以下代码: PARAMETER oCustom This.oFrm1Cust = oCustom...你可以使用这个方法轻松地在表单间传递多个数据,而且由于可以直接在被调用表单修改对象引用的数据,你甚至不需要返回任何参数——想想难以从一个表单返回数组的情况、从一个用CreateObject(表单类)的方法建立的表单无法返回参数的情况

1.5K10

Python动态图见得多了?Excel:亦可赛艇!我可是身经百战了

(2)开发工具-表单控件 但如果想要动态地修改 OFFSET 返回区域,还需要将其偏移、选取相关的参数绑定到单元格,通过修改单元格的,来修改函数内部参数。...要手动输入来修改单元格的也很麻烦,这时就要来到开发工具菜单栏(若没有这项则需要在 Excel 选项 call 出来),找到表单控件,本次笔者选用的是滑块。...右键滑块设置控件格式,即可通过滑块来修改单元格的。 (3)名称管理器 为了便于使用,先在公式菜单栏里找到名称管理器。 添加一个名称为“日产能A厂”,其引用位置为 =OFFSET(Sheet1!...G2, ),省略的两个参数默认分别为 0 和 1,如此即可通过滑块调整获得日产能的区域。...如果想以每 7 天为一个周期,查看每个周期的数据,还可以设置起始日滑块的步长为 7,然后修改跨度当前为 7 。 之后操作起始日滑块效果见下图。

5.1K10

浏览器事件

onchange: 窗口内表单元素的内容改变时触发。 oninput: 窗口内表单元素获取用户输入时触发。 onreset: 窗口内表单重置时触发。...onselect: 窗口内表单元素中文本被选中时触发。 onsubmit: 窗口内表单submit按钮被按下触发。 onhashchange: 当窗口的锚点哈希发生变化时触发。...onbeforeunload: 该事件在即将离开页面(刷新或关闭)时触发 onerror: 在加载文档或图像时发生错误。 onhashchange: 该事件在当前URL的锚部分发生修改时触发。...表单事件相关 onblur: 元素失去焦点时触发。 onchange: 该事件在表单元素的内容改变时触发。 onfocus: 元素获取焦点时触发。 onfocusin: 元素即将获取焦点时触发。...onfocusout: 元素即将失去焦点时触发。 oninput: 元素获取用户输入时触发。 onreset: 表单重置时触发。 onsearch: 用户向搜索域输入文本时触发。

2.4K20

最新iOS设计规范五|3大界面要素:控件(Controls)

七、选择器(Pickers) 选择器可以显示一个或多个可滚动的不同列表,供人们选择。在iOS 14及更高版本,日期选择器支持其他选择的方式,例如在日历视图中选择日期或使用数字键盘输入日期和时间。...另外,如果显示太长的选项,考虑使用列表或表单。列表和表单的高度可以调整,并且表单可以包含索引,这可以更快地定位列表的一部分。 使用可预测的和逻辑排序的。...当滑块发生变化时,最小和拇指之间的轨道部分会填充颜色。滑块的左右位置好可以展示图标,来说明最小和最大的含义。 ? 如有必要,可以自定义滑块的外观。...为了与你的设计风格融合并且准确地传达设计意图,滑块的外观是可以更改的,包括轨道颜色、“拇指”图标以及左右位置的图标。 不要使用滑块来调节音量。如果你的APP需要提供音量控制,请使用音量视图。...若需要输入的是敏感数据(密码)时,请始终使用安全提示类的文本字段。 使用图像和按钮在文本字段中提供清晰度和功能。

8.5K30
领券