Javascript popover loop не отображается

Question

Я пытаюсь создать цикл, чтобы отобразить некоторую ссылку с popover javascript. Это то, что я есть

accueil_hover.js

$(document).ready(function(){ 
$('#popoverOption').popover({ trigger: "hover" }); 
}); 

accueil_blade.php (предполагая, что данные, передаваемые в качестве аргумента OK)

<div class="container"> 
     @for ($i = 0 ; $i < count($etablissements); $i ++) 
      <a id="popoverOption" class="btn" data-content="here is some data" rel="popover" data-original-title="{{$etablissements[$i]->code_etablissement}}" data-placement="bottom" href="{{ URL::to('dashboard_etablissement/' . $etablissements[$i]->code_etablissement)}}">{{$etablissements[$i]->nom}}</a><br> 
     @endfor 

</div> 

Но поповер выиграл» т шоу. Я думаю, это потому, что все мои ссылки имеют одинаковый ID Но как я могу сделать его другим для javascript для понимания? примерно: popoverOption. $ I?

Answer 1

Id должно быть уникальным. Вы можете использовать Class вместо ID

$('.popoverOption').popover({ trigger: "hover" }); 

Разметки:

<a class="btn popoverOption" data-content="here is some data" rel="popover" data-original-title="{{$etablissements[$i]->code_etablissement}}" data-placement="bottom" href="{{ URL::to('dashboard_etablissement/' . $etablissements[$i]->code_etablissement)}}">{{$etablissements[$i]->nom}}</a><br> 

Answer 2

Вы можете достичь уникальных id атрибутов, как это:

<div class="container"> 
    @for ($i = 0 ; $i 
    < count($etablissements); $i ++) <a id="popoverOption_$i" class="btn" data-content="here is some data" rel="popover" data-original-title="{{$etablissements[$i]->code_etablissement}}" data-placement="bottom" href="{{ URL::to('dashboard_etablissement/' . $etablissements[$i]->code_etablissement)}}">{{$etablissements[$i]->nom}}</a> 
    <br>@endfor 

</div> 

И селектор бы [id^=popoverOption_]:

$(document).ready(function() { 
    $('[id^=popoverOption_]').popover({ 
    trigger: "hover" 
    }); 
});