मैं त्रुटि हो रही है: मॉडल bootstrap4 alpha6 साथ संक्रमण कर रहा है मैं उपयोग कर रहा हूँ bootstrap4 अल्फा 6 मोडल मोडल

Question

, मैं हो रही है:

Error: Modal is transitioning 

हो कि जब मैं कोशिश कर रहा हूँ फिर से ट्रिगर एक ही मॉडल फिर से गतिशील के साथ जावास्क्रिप्ट समारोह के माध्यम से डेटा निम्नलिखित के रूप में:

function openModal(title, text) { 
    $('.modal-title').text(title); 
    $('.modal-body p').text(text); 
    $('#modalAlert').modal('show'); 
} 

मैं setTimeout सुविधा का उपयोग करने की कोशिश की, लेकिन इस लेख में के रूप में काम नहीं किया: https://github.com/twbs/bootstrap/issues/21687

कोई सुझाव?

Answer 1

मैं बूटस्ट्रैप 4 मोडल का भी उपयोग कर रहा हूं, मेरा समाधान;

$(document).on('show.bs.modal', '.modal', function (event) { 
     var zIndex = 1040 + (10 * $('.modal:visible').length); 
     $(this).css('z-index', zIndex); 
     setTimeout(function() { 
      $('.modal-backdrop').not('.modal-stack').css('z-index', zIndex - 1).addClass('modal-stack'); 
     }, 0); 
    }); 

Answer 2

पहले मोडल खोलें और फिर डोम तत्वों मोडल के अंदर है कि खोजने की कोशिश (जैसे $('.modal-title') और $('.modal-body p')।)

अपने कार्य को क्रियान्वित करने के क्रम में काम कर सकते हैं बदलने:

function openModal(title, text) { 
    $('#modalAlert').modal('show'); 
    $('.modal-title').text(title); 
    $('.modal-body p').text(text); 
} 

अंत में, सुनिश्चित करें कि जब आप एचडीएमएल के अंदर मॉडेल का उपयोग करते हैं तो स्क्रीन में मोडल खुला/दृश्यमान होता है।

Answer 3

सबसे तेज़ समाधान इस त्रुटि को फेंकने वाले मोडल 'फीड' वर्ग को हटाना है। ऐसा लगता है कि बूटस्पर वी 6 का एक ज्ञात मुद्दा है जिसे अगले रिलीज में तय किया जाएगा।

देखें here

Answer 4

= अपने बटन प्रकार सेट करें 'प्रस्तुत' टाइप करने के लिए = 'बटन'

Answer 5

माता पिता div class से fade को दूर करने के साथ काम किया।

अंतिम मोडल कोड (भावी पीढ़ी के लिए यहाँ जोड़ा जा रहा है):

एचटीएमएल

<div class="modal loadingModal" id="applemodal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 
      <div class="modal-dialog" role="document"> 
       <div class="modal-body"> 
       <div class="row"> 
        <div class="col-md-6"> 
        </div> 
        <div class="col-md-6"> 
         <img src="ico/4.svg"> 
        </div> 
       </div> 
       </div> 
      </div> 
    </div> 

जे एस

$.ajax({ 
     type: "GET", 
     url: "/getTimeline", 
     data: { 
      'dateTime': selected 
     }, 
     async: true, 
     beforeSend: function() { 
       $('#applemodal').modal({ 
        backdrop: 'static', 
        keyboard: false 
       }); 
     }, 
     success: function(data) { 
      $('#applemodal').modal('toggle'); 
     } 
});