javascript - 如何将关闭 [X] 图标添加到 djextNameTextBox？

Question

不知道为什么，但在某些页面上此控件有 [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 上看到它

Answer 1

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

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

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

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