用途
本技能用于指导在 ASP.NET Core 应用中实现 Syncfusion 的 TextBox 组件。TextBox 是基础文本输入组件,除基本文本录入外,还支持浮动标签、校验视觉状态、前后置装饰(图标/按钮)以及无障碍访问支持。技能以 Syncfusion 的标签助手(Tag Helper)语法为主线,讲解如何在 ASP.NET Core 项目中配置与使用该组件。
主要能力
- 浮动标签:通过 floatLabelType 属性控制标签在聚焦或填充时浮于输入框上方,可选值 Auto、Always、Never。
- 校验状态:使用 e-error、e-warning、e-success 等 CSS 类提供错误、警告、成功等视觉反馈,并可与服务端/客户端校验集成。
- 装饰与图标:通过 prependTemplate 与 appendTemplate 在输入框前后添加图标、按钮或文本,支持密码可见性切换、清除按钮、单位指示等。
- 多行模式:将 TextBox 转换为 textarea,支持自动增高与调整大小、字符计数、多行校验与占位符。
- 数据绑定与事件:与 ASP.NET Core 模型双向绑定,支持 Created、Change、Input、Focus、Blur 等事件。
- 无障碍:内置对屏幕阅读器与键盘导航的支持,帮助满足 WCAG 2.2 Level AA 标准。
使用方式
技能给出的使用流程包括:安装 Syncfusion.EJ2.AspNet.Core NuGet 包;在 _ViewImports.cshtml 中通过 @addTagHelper *, Syncfusion.EJ2 配置标签助手;在 _Layout.cshtml 中通过 CDN 引入样式表(如 fluent.css)与脚本资源(ej2.min.js),并注册 <ejs-scripts>;随后在 Razor 页面中使用 <ejs-textbox> 标签编写输入框,例如设置 id、placeholder、floatLabelType、type 等属性。该技能按主题拆分为多份参考文档:getting-started.md(入门与安装配置)、tag-helper-syntax.md(标签助手语法与属性)、validation-states.md(校验状态)、adornments-and-icons.md(装饰与图标)、floating-labels.md(浮动标签)、multiline-textarea.md(多行文本域)、advanced-patterns.md(高级模式)。
关键属性
技能列出了常用属性及其默认值,包括:id、value、placeholder、floatLabelType(默认 Never)、multiline(默认 false)、readonly(默认 false)、disabled(默认 false)、cssClass、prependTemplate、appendTemplate、type(默认 text)。
适用场景
- 联系表单构建:结合浮动标签、校验与邮箱/电话格式校验。
- 搜索界面:前置图标与动态过滤、事件处理。
- 反馈/评论区域:多行模式、字符限制、自动增高。
- 无障碍注册表单:ARIA 标签、键盘导航、屏幕阅读器支持。
- 密码字段:带可见性切换的密码输入。
- 与 ASP.NET Core 模型集成,实现表单数据绑定与校验。
限制
资料未提供该组件的具体收费模式、价格或授权信息;未提供浏览器兼容性、性能基准等信息;未提供官方文档以外的版本对应细节。部分设置(如 CDN 中的版本占位符)需按实际项目版本替换。具体实现细节以各参考文档为准。