Событие $ (''). on ('seen.bs.modal') не вызывает никакой функции - PullRequest
0 голосов
/ 14 ноября 2018

Моя страница VisualForce имеет следующий код: и тег javascript для отображения диаграммы выглядит следующим образом:

<script>
$(document).ready(function() {
$('#idPanelGraphs').on('shown.bs.modal', function () {
    createChart('#barChart2', options);
});
});
</script>   

<div role="tabpanel" class="tab-pane fade idPanel panel-group" id="vertical-tab">
<div id="idPanelGraphs" class="idPanel panel-group collapsible-group" data-chevron-down="glyphicon-chevron-down" data-chevron-up="glyphicon-chevron-up">
   <div class="panel panel-default">
      <div class="panel-body">
         <div class="row">
            <div class="col-md-12">
               <div class="row">
                  <div class="col-md-12">
                     <div id="barChart2" style="height:255px;" />
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>

Теперь в соответствии с кодом, как только активируется idpanelGraphs, диаграмма должна быть загружена.Но это не вызывает функцию createChart.

То же самое работает при изменении модального на сворачиваемое:

 $('#idPanelGraphs').on('shown.bs.collapse', function () {
            createChart('#barChart2', options);
        });


<div role="tabpanel" class="tab-pane fade idPanel panel-group" id="vertical-tab4">
<div id="idPanelGraphs" class="idPanel panel-group collapsible-group" data-chevron-down="glyphicon-chevron-down" data-chevron-up="glyphicon-chevron-up">
   <div class="panel panel-default">
      <div class="panel-heading" data-toggle="collapse" data-target="#collapseGraphTab">
         <h4 class="panel-title">
            Graphs
            <i class="indicator glyphicon glyphicon-chevron-up"/>
         </h4>
      </div>
      <div id="collapseGraphTab" class="panel-collapse collapse">
         <div class="panel-body">
            <div class="row">
               <div class="col-md-12">
                  <div class="row">
                     <div class="col-md-12">
                        <div id="barChart2" style="height:255px;" />
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>

1 Ответ

0 голосов
/ 14 ноября 2018

Надеюсь, что это работает ..

<div class="panel panel-default fade">
    <div class="panel-heading"><h3 class="panel-title">Panel title</h3></div>
    <div class="panel-body">Panel content</div>
</div>

<button id="test">Show panel</button>
function triggerPanel() {
    // All your code can go here..
    // createChart('#barChart2', options); ???

    $('.panel').toggleClass('fade');
}

$(document).ready(function() {
    $('#test').on('click', triggerPanel);
});
...