2

マルチセレクト(マルチセレクト ブートストラップ プラグインから)をポップオーバー(ポップオーバー ブートストラップ プラグインから)に挿入したい。

残念ながら、複数選択は正しく初期化されておらず、結果は従来のブートストラップの複数選択ボックスになります。

multiselect はブートストラップ multiselect であり、multiselect-bootstrap プラグイン multiselect ではありません

これが私のコードです:

<html>
<head>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-multiselect.css">
</head>

<body>

<button id="mypopover" type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content='
        <div class="btn-group">
            <select class="form-control multiselect" multiple="multiple">
                <option>Choice 1</option>
                <option>Choice 2</option>
                <option>Choice 3</option>
            </select>
            <button class="btn btn-default" type="button">&nbsp;<span class="glyphicon glyphicon-remove"></span>&nbsp;</button>
            <button class="btn btn-primary" type="button">&nbsp;<span class="glyphicon glyphicon-ok"></span>&nbsp;</button>
        </div>
    ' data-title="Filter">
    My popover
</button>


<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-multiselect.js"></script>
<script src="js/bootstrap-tooltip.js"></script>
<script src="js/bootstrap-popover.js"></script>
<script>  
    $(function() {
        // Popover
        $("#mypopover").popover({
            trigger:'click', 
            html:true, 
            content:function(){return $("#popover-content").html();}}
        );
        $('.multiselect').multiselect();
    }); 
</script>

</body>
</html>
4

1 に答える 1

2

私はこの方法を見つけました:

<script>  
    $(function() {
        $("#mypopover").popover({
            trigger:'click', 
            html:true, 
            content:function(){return $("#popover-content").html();}}
        ).on('click',function () {
            $('.multiselect').multiselect();
        });  
    }); 
</script>

イベント「show.bs.popover」を使用する方がよいでしょう。

于 2014-03-14T16:09:30.283 に答える