Semantic UI Modal onShow/onVisible funktioniert nicht?

Question

Eine weitere modale Frage zu Semantic UI, die sich auf die Größenänderung einer eingebetteten Google Map nach Modal bezieht, wird angezeigt. Nach mehreren Versuchen habe ich das Problem vereinfacht, Callbacks zu erhalten, wenn Modal gezeigt oder sichtbar ist.

Aber kein Glück. onShow oder onVisible ist immer ausgegraut. Hier ist der Code-Schnipsel:

$('.ui.modal') 
 
    .modal({ 
 
     onVisible: function() { 
 
      console.log("hahaha"); 
 
     } 
 
    }).modal({ 
 
     onApprove: function() { 
 
      console.log("hehehe"); 
 
     } 
 
    }).modal('attach events', '#btn-show');

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css" rel="stylesheet"/> 
 
<!--Load JS libaries; Order is important and Load Jquery first --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"></script> 
 

 

 
<button class="ui button" id="btn-show"> 
 
    Show modal 
 
</button> 
 

 
<div class="ui modal"> 
 
    <!--<i class="close icon"></i>--> 
 
    <div class="header"> 
 
     Mark your project on the map 
 
    </div> 
 
    <div class="content"> 
 
     <p>Content</p> 
 
     <div class="actions" style="text-align: right"> 
 
      <div class="ui deny button" id="btn-close-modal-1"> 
 
       Cancel 
 
      </div> 
 
      <div class="ui approve orange right labeled icon button" id="btn-open-modal-2"> 
 
       Next 
 
       <i class="chevron right icon"></i> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div>

Answer 1

Sie geben sollten onVisible und onApprove Rückrufe in der gleichen .modal() Aufruf:

$('.ui.modal').modal({ 
    onVisible: function() { 
     console.log('visible'); 
    }, 
    onApprove: function() { 
     console.log('approved'); 
    } 
    }).modal('attach events', '#btn-show'); 

hier ein fiddle