与JSF一起使用jquery.sumoselect

我想在JSF中使用jquery.sumoselect（https://hemantnegi.github.io/jquery.sumoselect/sumoselect_demo.html）。但是我不能。我尝试以下操作：与JSF一起使用jquery.sumoselect

<h:outputStylesheet library="jquery.sumoselect" name="css/sumoselect.css" /> 
<h:outputScript library="jquery.sumoselect" name="js/jquery.sumoselect.js" /> 
<script> 
    $('.sumoselect').SumoSelect(); 
</script> 
... 

<h:form> 
    ... 
    <h:selectManyListbox id="language" value="#{viewController.languageList}" styleClass="sumoselect"> 
    <f:selectItems value="#{applicationStartupController.languageList}" var="language" itemValue="#{language.code}" itemLabel="#{language.description}" /> 
    </h:selectManyListbox> 
    ... 
</h:form>

但是我得到的是下面的图片：

，而不是类似于：

一个什么样的任何想法发生了什么？我相信，CSS和JS文件正确计费。

来源

2016-08-30 Aliuk

没有进入细节，你可以试试这个'' – mike123

您是否暗示相同的方法可以正常使用“普通”HTML而不是使用JSF生成的HTML输出？迄今发布的代码表明，它会以同样的方式失败。 – BalusC

mike123，它仍然不能用你的脚本 – Aliuk

一切似乎都OK，但你应该运行SumoSelect()后的文件已准备就绪：

<h:head> 
    <title>Sumo</title> 
    <h:outputStylesheet library="css" name="sumoselect.css"/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
    <h:outputScript library="js" name="jquery.sumoselect.min.js"/> 
</h:head> 

<h:body> 

    <h:selectManyListbox styleClass="test"> 
     <f:selectItem itemValue="1" itemLabel="Item 1" /> 
     <f:selectItem itemValue="2" itemLabel="Item 2" /> 
     <f:selectItem itemValue="3" itemLabel="Item 3" /> 
    </h:selectManyListbox> 

    <script> 
     $(document).ready(function(){ 
      $('.test').SumoSelect({okCancelInMulti:true, selectAll:true }); 
     }); 
    </script> 
</h:body>

来源

2016-08-31 08:39:03

与JSF一起使用jquery.sumoselect

回答

相关问题