0

選択入力が変更されると、3 つのポップオーバーが表示/変更される必要があります。これらのポップオーバーのうち 2 つは正しく機能します。ただし、3 番目は、要素が含まれるコンテナ div の上部に表示されます。

<div id='tab2'>
  <div id='leftcol'>
    <label>for select</label>
    <select>...</select>
    <label>for select</label>
    <select>...</select>
    <div id="casestrengthpop" class="popholder" rel="popover" data-content="" data-html='true' data-placement='bottom'></div>
  </div>
</div>

これらはどちらも前述の選択ではありません。これは、機能していないポップオーバーを示しています。

$.post(url, function(json){
        if (json != '[]'){
            popdata = JSON.parse(json);
            if(popdata.aol_info != ''){     $('#subaolpop').attr('data-content',        popdata.aol_info).popover('show');}
            if(popdata.asset_info != ''){   $('#subaolassetpop').attr('data-content',   popdata.asset_info).popover('show');}
            if(popdata.very_weak_case != ''){
                var strStrength = '<b>Very Weak Case:</b> '+popdata.very_weak_case;
                strStrength += '<br /><b>Weak Case:</b> '+popdata.weak_case;
                ...
                $('#casestrengthpop').attr('data-content',  strStrength).popover('show');
            }
        }else{
            hideallpops();  
            console.log("No Popover data available");
        }
    });

これはすべて正しいデータを作成し、ポップオーバーが表示されますが、「casestrengthpop」は独自の div ではなく、div「leftcol」の上部に表示されます。

leftcol の高さを確実にオーバーフローしないように、テキストの量を減らしてみました。

このポップオーバーと他の 2 つの違いは、その場所だけです。それらは別の 'tab' div 内にあり、その表示は 'block' に設定され、この 'tab2' は 'none' に設定されています。

これは問題を引き起こしますか?なぜそれが必要なのかわかりませんか?

4

0 に答える 0