在 xpages 中使用 Typeahead.js 和 Bootstrap 3 不起作用
Using Typeahead.js with Bootstrap 3 in xpages not working
我正在尝试在 Xpage 中将 typeahead.js 功能与 bootstrap 3 结合使用。
我已将 Bootstrap 3 个文件、jQuery2.4.3 和 typeahead.js 包含在数据库 (webContent) 中,并将它们作为资源与输入 field/Editbox 一起包含并分配给它'typeahead' 的 class。
我正在使用 Mark Leusink to another separate issue Xpages: TypeAhead with Bootstrap 的回复中的示例。
查看下面我的 Xpage 代码:
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" >
<xp:this.resources>
<xp:styleSheet href="/bootstrap/css/bootstrap.min.css"></xp:styleSheet>
<xp:styleSheet
href="/bootstrap/css/typeahead.js-bootstrap.css">
</xp:styleSheet>
<xp:script src="/jquery/jquery-2.1.4.js"
clientSide="true">
</xp:script>
<xp:script src="/bootstrap/js/bootstrap.js"
clientSide="true">
</xp:script>
<xp:script src="/jquery/x$.js"
clientSide="true">
</xp:script>
<xp:script src="/typeahead/typeahead.bundle.js"
clientSide="true">
</xp:script>
</xp:this.resources>
<xp:this.beforePageLoad>
<![CDATA[#{javascript:viewScope.put("typeaheadOptions", toJson(["Alabama", "Alaska"]));}]]>
</xp:this.beforePageLoad>
<xp:inputText id="inputText1" autocomplete="off"
styleClass="typeahead tt-query">
</xp:inputText>
<xp:scriptBlock id="scriptBlock1">
<xp:this.value><![CDATA[var value = #{viewScope.typeaheadOptions};
x$('inputText1').typeahead({source: value });
]]></xp:this.value>
</xp:scriptBlock>
</xp:view>
当我在输入字段中输入时,没有任何反应。我做错了什么?
谢谢
我现在可以使用这些项目。我相信这取决于我修改 JS 文件以禁用 AMD 加载程序的方式。当我重复修改原件并重新加载的过程时,它就起作用了。此外,我现在同意 david 和警告消息“主线程上的同步 XMLHttpRequest 可以忽略
我正在尝试在 Xpage 中将 typeahead.js 功能与 bootstrap 3 结合使用。
我已将 Bootstrap 3 个文件、jQuery2.4.3 和 typeahead.js 包含在数据库 (webContent) 中,并将它们作为资源与输入 field/Editbox 一起包含并分配给它'typeahead' 的 class。
我正在使用 Mark Leusink to another separate issue Xpages: TypeAhead with Bootstrap 的回复中的示例。
查看下面我的 Xpage 代码:
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" >
<xp:this.resources>
<xp:styleSheet href="/bootstrap/css/bootstrap.min.css"></xp:styleSheet>
<xp:styleSheet
href="/bootstrap/css/typeahead.js-bootstrap.css">
</xp:styleSheet>
<xp:script src="/jquery/jquery-2.1.4.js"
clientSide="true">
</xp:script>
<xp:script src="/bootstrap/js/bootstrap.js"
clientSide="true">
</xp:script>
<xp:script src="/jquery/x$.js"
clientSide="true">
</xp:script>
<xp:script src="/typeahead/typeahead.bundle.js"
clientSide="true">
</xp:script>
</xp:this.resources>
<xp:this.beforePageLoad>
<![CDATA[#{javascript:viewScope.put("typeaheadOptions", toJson(["Alabama", "Alaska"]));}]]>
</xp:this.beforePageLoad>
<xp:inputText id="inputText1" autocomplete="off"
styleClass="typeahead tt-query">
</xp:inputText>
<xp:scriptBlock id="scriptBlock1">
<xp:this.value><![CDATA[var value = #{viewScope.typeaheadOptions};
x$('inputText1').typeahead({source: value });
]]></xp:this.value>
</xp:scriptBlock>
</xp:view>
当我在输入字段中输入时,没有任何反应。我做错了什么?
谢谢
我现在可以使用这些项目。我相信这取决于我修改 JS 文件以禁用 AMD 加载程序的方式。当我重复修改原件并重新加载的过程时,它就起作用了。此外,我现在同意 david 和警告消息“主线程上的同步 XMLHttpRequest 可以忽略