如何将关闭 [X] 图标添加到 djextNameTextBox？答案

【问题标题】：how to add close [X] icon to djextNameTextBox?如何将关闭 [X] 图标添加到 djextNameTextBox？
【发布时间】：2016-01-19 21:37:04
【问题描述】：

不知道为什么，但是在某些页面上这个控件有 [X] 图标，而在另一个页面上没有。我需要能够通过单击此图标从列表中删除名称

<?xml version="1.0" encoding="UTF-8"?>
<xp:view 
       xmlns:xp="http://www.ibm.com/xsp/core"
       xmlns:xc="http://www.ibm.com/xsp/custom"
       xmlns:xe="http://www.ibm.com/xsp/coreex">

<xe:djextNameTextBox id="djextNameTextBox1" multipleSeparator="," multipleTrim="true">
    <xe:this.value><![CDATA[#{javascript:"NAME1,NAME2,NAME3"}]]>/xe:this.value>
</xe:djextNameTextBox>
</xp:view>

使用 .lotusFilter .lotusClose css 没有帮助。此图标仅出现在设计模式中，但我在 xPage 上看不到它

【问题讨论】：

标签： javascript css dojo xpages dijit.form

【解决方案1】：

X 图标用于从字段绑定的任何内容中删除选定的选项。它不是通过 CSS 添加的，它仅在组件可以编辑时添加，但在您的实现中它不是。

value 属性，对于这个和任何可编辑组件，用于将其绑定到范围变量或数据源属性（例如 #{document1.myField}）。它定义了您要存储数据的位置，而不是默认值（即defaultValue 属性）。所以<xe:this.value><![CDATA[#{javascript:"NAME1,NAME2,NAME3"}]]>/xe:this.value> 表示您正在尝试将选择的任何内容存储到名为“NAME1,NAME2,NAME3”的字符串中。因为它不可编辑并且不能存储在任何地方，所以它不允许您删除值 - 它有效地显示了组件的只读版本。

您需要使用value 属性映射到数据源属性。如果您想要一个默认值，可以在defaultValue 属性或beforePageLoad 或其他此类事件中完成。（我不确定单个逗号分隔的字符串是否可以设置默认值，或者您是否需要传递数组/向量/列表。）

我强烈建议查看 Extension Library Demo 数据库（OpenNTF 下载文件中的 XPagesExt.nsf）中的示例，特别是 Domino_Pickers.xsp，Name Pickers 选项卡。它是任何扩展库组件的最佳参考，也是我们编写 XPages 扩展库书籍时使用的关键资源。

【讨论】：