2016-07-08 7 views
0

jQueryプラグインで同じselect2を実行したいと思いますが、そのたびにエラーが表示されます。 .jsファイルと.cssファイルをWeb-Contentフォルダに入れてテーマに追加しました。私は、ブートストラップ・select.jsとdropdown.jsファイルが同じフォルダ CSSであるSelect2 JQuery Plugin in XPages

X $ .jsファイルは、もある:(何かを逃したと思います。私をお勧めしてください私はそれが働い取得する?

何をすべき

Where my Files are in... 私のテーマは、このようになります。

<theme 
    extends="Bootstrap3.2.0" 
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
    xsi:noNamespaceSchemaLocation="platform:/plugin/com.ibm.designer.domino.stylekits/schema/stylekit.xsd"> 
    <resources> 
     <metaData> 
      <httpEquiv>X-UA-Compatible</httpEquiv> 
      <content>IE=11</content> 
     </metaData> 
    </resources> 

    <resource> 
     <content-type>application/x-javascript</content-type> 
     <href>js/x$.js</href> 
    </resource> 
    <resource> 
     <content-type>application/x-javascript</content-type> 
     <href>js/bootstrap-select.js</href> 
    </resource> 
     <resource> 
     <content-type>application/x-javascript</content-type> 
     <href>js/dropdown.js</href> 
    </resource> 
    <resource> 
     <content-type>text/css</content-type> 
     <href>css/bootstrap-select.css</href> 
    </resource> 

</theme> 

マイページコードが

<?xml version="1.0" encoding="UTF-8"?> 
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"> 
<xp:scriptBlock id="scriptBlock1"> 
<xp:this.value><![CDATA[ 
$(document).ready(
function() { 
x$("#{id:listBox1}").selectpicker({ 
style: 'btn-info', 
size: 4, 
title: 'Choose one of the following...' 
}); 
}); 
]]></xp:this.value> 
</xp:scriptBlock> 
<xp:scriptBlock id="scriptBlock2"> 
<xp:this.value><![CDATA[ 
$(document).ready(
function() { 
x$("#{id:comboBox1}").selectpicker({ 
style: 'btn-success', 
size: 4, 
title: 'Select an option...' 
}); 
}); 
]]></xp:this.value> 
</xp:scriptBlock> 
<xp:panel> 
<h2>Bootstrap Select</h2> 
<h4>Bootstrap-select is a jQuery plugin that utilizes Bootstrap's dropdown.js to 
style and bring additional functionality to normal select boxes.</h4><xp:br></xp:br> 
<div class="col-md-7"> 
<div class="selectpicker"> 
<xp:listBox id="listBox1" multiple="true"> 
    <xp:selectItems> 
     <xp:this.value><![CDATA[#{javascript:var lis= ["B1","B2","B3","B44"]; 
return lis;}]]></xp:this.value> 
    </xp:selectItems> 
</xp:listBox> 
</div> 
</div> 
<div class="col-md-7"><div class="selectpicker"> 
</div> 
</div> 
</xp:panel> 
</xp:view> 

です

答えて

1

このプラグインはBootstrap4XPagesに含まれています。私はそれを強くお勧めします。手動で追加する経験のある人はほとんどいません。

+0

私は右ないです場合は、私を修正してください。このプラグインのonChangeイベントの全部または一部をリフレッシュしても機能しません。 –

1

Johnny Oldenburgerがこれについてブログしています。あなたのXPageアプリケーションに手動で追加するときにこれは動作しますhttps://xpagesandmore.blogspot.com/

ハワード