form布局中添加红色提示信息
来源：互联网 发布：淘宝店铺地址是无效的 编辑：程序博客网 时间：2024/04/29 03:39
不在一行：
这个比较简单，直接在form布局中添加一个组件label就可以了
// 新增景点表单 var addSpot_form = Ext.create('Haso.Components.InputFormPanel', { id: id_formPanel, items: [{ id: id_spotId, hidden: true, name: 'viewspotDto.viewspot.id' }, { id: id_txtSpotName, fieldLabel: Res.ViewSpot.NAME, // 名称 emptyText: Res.EmptyText.TEXT_002,// 必填，50个字符以下 name: 'viewspotDto.viewspot.name' }, { xtype: 'container', layout: 'hbox', defaultType: 'textfield', margin: '0 0 5 0', defaults: { labelWidth: 80 }, items: [{ id: id_city, fieldLabel: Res.ViewSpot.CITY, // 所在城市 readOnly: true, emptyText: '必填', name: 'viewspotDto.viewspot.city.name' }, {// 清空按钮 xtype: 'haso-ClearButton', textFieldId: clearArray }] }, { id: id_address, fieldLabel: Res.ViewSpot.ADDRESS, // 详细地址 emptyText: Res.EmptyText.TEXT_002,// 必填，50个字符以下 name: 'viewspotDto.viewspot.address' }, { id: id_telephone, fieldLabel: Res.ViewSpot.TEL,// 联系方式 emptyText: Res.EmptyText.TEXT_003,// 20个字符以下' name: 'viewspotDto.viewspot.telphone' }, { xtype: 'container', layout: 'hbox', defaultType: 'haso-DateField', margin: '0 0 5 0', defaults: { labelWidth: 80 }, items: [{// 工作日 xtype: 'displayfield', width: 80, margin: '0 3 0 0', value: Res.ViewSpot.WEEKDAYS }, {// 开始时间 xtype: 'haso-TimeField', id: id_weekday_begintime, name: 'viewspotDto.viewspot.weekdayBeginDatetime' }, {// '-' xtype: 'displayfield', margin: '0 10 0 10', value: '-' }, {// 结束时间 xtype: 'haso-TimeField', id: id_weekday_endtime, name: 'viewspotDto.viewspot.weekdayEndDatetime' }] }, { xtype: 'container', layout: 'hbox', defaultType: 'haso-DateField', margin: '0 0 5 0', defaults: { labelWidth: 80 }, items: [{// 周末 xtype: 'displayfield', width: 80, margin: '0 3 0 0', value: Res.ViewSpot.WEEKEND }, {// 开始时间 xtype: 'haso-TimeField', id: id_weekend_begintime, name: 'viewspotDto.viewspot.weekendBeginDatetime' }, {// '-' xtype: 'displayfield', margin: '0 10 0 10', value: '-' }, {// 结束时间 xtype: 'haso-TimeField', id: id_weekend_endtime, name: 'viewspotDto.viewspot.weekendEndDatetime' }] }, { id: id_fee, fieldLabel: Res.ViewSpot.FEES,// 门票, emptyText: Res.EmptyText.TEXT_007,// 50个字符以下 name: 'viewspotDto.viewspot.fee' }, { id: id_busInfo, fieldLabel: Res.ViewSpot.BUSINFO, // 乘车信息 emptyText: Res.EmptyText.TEXT_004,// 200个字符以下 name: 'viewspotDto.viewspot.busInfo' }, { id: id_website, fieldLabel: Res.ViewSpot.URL, // 网址, emptyText: Res.EmptyText.TEXT_005,// 100个字符以下 name: 'viewspotDto.viewspot.url' }, { id: id_description, xtype: 'textareafield', name: 'viewspotDto.viewspot.description', emptyText: Res.EmptyText.TEXT_004,// 200个字符以下 fieldLabel: Res.ViewSpot.DESCRIPTION, // 基本说明 height: 120, grow: true// 文本域会根据输入的内容自动修改自身高度 }, { id: id_pic, xtype: 'filefield', fieldLabel: this.Res.FRM_PIC, // 照片, name: 'viewspotDto.vsImage', emptyText: Res.EmptyText.TEXT_001, allBlank: false, msgTarget: 'side',// 错误在右边显示 buttonText: Res.Com.CHOOSE// 选择 }, { xtype: 'combobox', id: id_type, name: 'viewspotDto.viewspot.type', fieldLabel: Res.ViewSpot.TYPE, // 类型 value: '1',// 设置默认选中值 store: Ext.create('Ext.data.Store', { fields: ['value', 'display'], data : Com.Const.LONGITUDE_LATITUDE_TYPE }), editable: false, // 设置为只可选择，不可编辑 queryMode: 'local',// 本地数据时使用'local' displayField: 'display', valueField: 'value' }, { id: id_latitude, fieldLabel: Res.ViewSpot.LATITUDE, // 纬度, emptyText: Res.EmptyText.TEXT_003,// 20个字符以下 name: 'viewspotDto.viewspot.latitude' }, { id: id_longitude, fieldLabel: Res.ViewSpot.LONGITUDE, // 经度, emptyText: Res.EmptyText.TEXT_003,// 20个字符以下 name: 'viewspotDto.viewspot.longitude' }, { xtype: 'combobox', id: id_editstatus, name: 'viewspotDto.viewspot.editStatus', fieldLabel: Res.ViewSpot.EDIT_STATUS, // 编辑状态 value: '0',// 设置默认选中值 store: Ext.create('Ext.data.Store', { fields: ['value', 'display'], data : Com.Const.VIEW_SPOT_EDIT_STATUS }), editable: false, // 设置为只可选择，不可编辑 queryMode: 'local',// 本地数据时使用'local' displayField: 'display', valueField: 'value' }, { xtype: 'label', html: '<span style=\'color:red\'>编辑中： event页面不能选择该景点</br>已完成： event页面可以选择该景点</span>' }, { xtype: 'hiddenfield', id: id_hidden_picUrl, name: 'viewspotDto.hiddenUrl', value: '' },{ xtype: 'hiddenfield', id: id_hidden_edit, name: 'viewspotDto.edit', value: '0' },{// 城市ID id: id_cityId, xtype: 'hiddenfield', name: 'viewspotDto.viewspot.city.id' }] });{ xtype: 'label', html: '<span style=\'color:red\'>编辑中： event页面不能选择该景点</br>已完成： event页面可以选择该景点</span>' }这个就是新加的label组件，用于解释，上一个控件的作用的效果图：
第二种是在同一行显示的：
var formPanel = Ext.create('Haso.Components.InputFormPanel', { id: id_formPanel, region: 'north', split: false, items: [{// 用户名 id: id_txtLonginName, fieldLabel: Res.User.LOGIN_NAME, name: 'UserInfo.UserId', emptyText: Res.EmptyText.TEXT_001, // '必填', flex: 1, // 设定hbox下所占比例 allowBlank: true }, {// 密码 id: id_txtPassword, fieldLabel: Res.User.PASSWORD, inputType: 'password', // 隐藏输入内容，显示为“·”号 name: 'UserInfo.PWD', emptyText: Res.EmptyText.TEXT_001, // '必填', flex: 1, // 设定hbox下所占比例 allowBlank: true }, {// 密码确认 id: id_txtPasswordTwo, fieldLabel: Res.User.PASSWORD_TWO, inputType: 'password', // 隐藏输入内容，显示为“·”号 name: 'UserInfo.PWDTwo', emptyText: Res.EmptyText.TEXT_001, // '必填', flex: 1, // 设定hbox下所占比例 allowBlank: true }, {// 显示名 id: id_txtDisplayName, fieldLabel: Res.User.DISPLAY_NAME, name: 'UserInfo.UserName', // emptyText: this.Res.EMPTY_TEXT, // '50个字符以下,例如：学生半价', flex: 1, // 设定hbox下所占比例 allowBlank: true }, {// U8用户名 id: id_txtU8UserName, fieldLabel: Res.User.U8_USER_NAME, name: 'UserInfo.UserId_U8', emptyText: Res.EmptyText.TEXT_001, // '必填', flex: 1, // 设定hbox下所占比例 allowBlank: true }, { xtype: 'panel', border: false, layout: 'column', defaults: { labelWidth: 80 }, items: [{ // 是否是管理员 id: id_chkAdmin, xtype: 'checkboxfield', fieldLabel: Res.User.IS_ADMIN, boxLabel: Res.User.ADMIN, inputValue: true, name: 'UserInfo.IsAdmin', flex: 1, // 设定hbox下所占比例 allowBlank: true }, { xtype: 'label', margin: '3 0 0 5', html: '<span style=\'color:red\'>*设置管理员权限</span>' }] }] });在form里面要加个column布局，看最后的一段代码就明白了，不过那个文字label要稍作布局修改
效果图：
- form布局中添加红色提示信息
- 如何在文本框中添加提示信息
- 屏蔽FORM系统提示信息
- ExtJS4为form表单必填项添加红色*标识
- 添加提示信息 tooltip
- 在ax所有From中添加信息提示
- Form信息提示框的基本使用
- Oracle Form开发中布局
- 会员中心选项添加提示信息
- KindEditor 添加默认提示信息
- jsp中提示信息
- PDF Form中添加背景图片
- 将你的 QQ 头像（或者微博头像）右上角加上红色的数字，类似于微信未读信息数量那种提示效果。 类似于图中效果
- python练习 将你的 QQ 头像（或者微博头像）右上角加上红色的数字，类似于微信未读信息数量那种提示效果。 类似于图中效果
- 布局中添加虚线
- [FUNC]AutoHotkey提示信息，只显示彩色文字 比如红色文字
- QLineEdit设置错误提示信息，并且设置QLineEdit设置为红色
- 友盟推送设备描述红色，提示筛选信息为空的解决方法
- 上班一年的感悟
- WINCE6.0在控制面板添加应用程序
- C++多态个人总结
- C# 参考之方法参数关键字：params、ref及out
- java读取配置文件
- form布局中添加红色提示信息
- Libnet开发流程总结
- android中如何屏蔽长按menu出现的输入法
- 主程序与动态库之间的全局变量
- 在Watir中识别HTML标签
- Defect Patterns (To be continued)
- 将NSLog写到文件
- win7下如何安装Itunes
- 深入理解linux i节点(inode)
