0

我开始使用 Bootsfaces,但在使用<b:selectManyMenu>标签时遇到了问题。

这是我的 xhtml 页面:

<link rel="stylesheet"
    href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"></link>
<link rel='stylesheet' type='text/css'
    href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.4.1/css/bootstrap-slider.css"></link>
<link rel='stylesheet' type='text/css'
    href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css
    "></link>
<link rel="stylesheet" type="text/css"
    href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/css/bootstrap-multiselect.css"></link>
<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script
    src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.4.1/bootstrap-slider.js"></script>
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>
<script
    src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<script
    src="https://cdn.datatables.net/1.10.13/js/dataTables.bootstrap.min.js"></script>

<div>
                                    <h:outputLabel value="Select key columns:"/>
                                    <br></br>
                                    <b:selectMultiMenu value="#{controller.keyColumns}">
                                        <f:selectItems value="#{controller.keyLista()}" var="f"
                                            itemLabel="column: -#{f}" itemValue="#{f}"></f:selectItems>
                                    </b:selectMultiMenu>
                                </div>

其中 varkeyColumnskeyColumns1are List<String>。问题是没有选择列表中的任何一个元素,但是如果我使用<b:selectOneMenu>所有元素都可以。

谷歌控制台显示“未捕获的 TypeError:$(...).multiselect 不是函数”。Ps:我需要其他项目功能的所有脚本,我无法使用 bootsfaces 标签更改所有脚本。有没有办法只在这种情况下使用正确的 jquery 代码?

谢谢

4

1 回答 1

1

就像 Kukeltje 已经写的那样,只需删除所有这些 JavaScript 导入。您不需要它们,因为它们已经是 BootsFaces 的一部分。另外,它们会导致问题。您正在尝试在加载 jQuery 文件之前初始化 selectMultiMenu。但是必须先加载 jQuery。

2018 年 6 月 4 日更新:与此同时,BootsFaces 1.2.0 已经发布。它包含几个错误修正<b:selectMultMenu />。所以跳过下面提到的快照版本,直接跳到 1.2.0(或者当你阅读本文时,当前版本是什么)。

更新:我刚看到你的帖子。您可能需要所有这些 JS 和 CSS 依赖项,但您不需要在每个页面上都使用它们。例如,包含 BootsFaces 组件的每个页面都会自动包含 jQuery 和 Bootstrap 文件,除非您另外配置 BootsFaces。并且每个包含 b:multiSelectMenu 的页面都会自动加载 JavaScript 文件(并且无法禁用它)。另请参阅http://showcase.bootsfaces.net/layout/resourcemanagement.jsfhttp://showcase.bootsfaces.net/miscellaneous/Configuration.jsf

顺便说一句,您可能想要更新到 BootsFaces-1.1.0-SNAPSHOT。我们已经修复了 b:selectMultiMenu 的几个错误,但在撰写本文时,尚未在 Maven Central 上发布正式版本。请参阅这张票以了解如何获得它。

也就是说,这是您的代码段的最小工作版本:

    <?xml version='1.0' encoding='UTF-8' ?>                                                                                                
    <!DOCTYPE html>                                                                                                                        
    <html xmlns="http://www.w3.org/1999/xhtml"                                                                                             
          xmlns:h="http://java.sun.com/jsf/html"                                                                                           
          xmlns:f="http://java.sun.com/jsf/core"                                                                                           
          xmlns:b="http://bootsfaces.net/ui"                                                                                               
          >                                                                                                                                
        <h:head>                                                                                                                           
            <title>BootsFaces rocks!</title>                                                                                               
            <meta name="author" content="Stephan Rauh"></meta>                                                                             
        </h:head>                                                                                                                          
        <h:body>                                                                                                                           
          <b:selectMultiMenu value="#{formBean.combobox}">                                                                                 
            <f:selectItem itemValue="0" itemLabel="red"></f:selectItem>                                                                    
            <f:selectItem itemValue="1" itemLabel="yellow"></f:selectItem>                                                                 
            <f:selectItem itemValue="2" itemLabel="green"></f:selectItem>                                                                  
          </b:selectMultiMenu>                                                                                                             
        </h:body>                                                                                                                          
    </html>                                                                                                                                
于 2016-12-30T15:59:16.333 回答