ट्विटर बूटस्ट्रैप एकाधिक मोडल त्रुटि

Question

मैं एक और मोडल के अंदर एक मॉडल करने की कोशिश करता हूं। हालांकि, मुझे फ़ायरफ़ॉक्स में "बहुत अधिक रिकर्सन" जैसी त्रुटि मिली।

मैंने नवीनतम jQuery और ट्विटरबूटस्ट्रैप का उपयोग किया लेकिन अभी भी यह समस्या है।

यहाँ plunker कि त्रुटि से पता चलता है

आप पा सकते हैं "Uncaught RangeError: अधिकतम कॉल स्टैक आकार से अधिक हो" या "बहुत ज्यादा प्रत्यावर्तन" कंसोल में

त्रुटि

किसी को भी जानता है कि कैसे करने के लिए इसे ठीक करो ? धन्यवाद

Answer 1

ठीक है, ऐसा लगता है कि यह एक समस्या है।

(जाहिरा तौर पर मैं कुंजी शब्द का प्रयोग करना चाहिए "Uncaught RangeError: अधिकतम कॉल स्टैक आकार से अधिक हो" के बदले "बहुत ज्यादा प्रत्यावर्तन" :()

यहाँ समाधान कर रहे हैं

1. मॉडल को संशोधित। .js

इस पोस्ट में

, https://github.com/twbs/bootstrap/pull/5022

@onassar एक समाधान को लाने

Follow up: for anyone working with bootstrap-modal v2.2.0, in the enforceFocus method, commenting out that.$element.focus() seems to fix the issue.

The result of this is the modal's don't get focused upon (pfft, I can do that myself :P), and thus, the multiple modals don't challenge one-another for focus (which resulted in an infinite loop, and a rangerror/recursive loop).

Hope that helps :)

मैंने कोशिश की और यह काम करता है। (plunker)

2. उपयोग another plugin संबोधित करने के लिए इसDemo

ऐसा लगता है यह बहुत अच्छी तरह से काम करता है की तरह।

3. आधिकारिक समाधान की प्रतीक्षा करें।

उनके roadmap में, वे किसी भी समय इस मॉडल प्लगइन को फिर से लिखना चाहते हैं।

Answer 2

4. या आप कर सकता है निम्नलिखित जब एक नया मॉडल दिखा:

1. छिपाएं किसी भी मॉडल है कि वर्तमान में सक्रिय
2. नया मोडल

3. दिखाएँ जब आप नए मॉडल बंद है यह शो पहले से छिपा मोडल (रों)

   var showModal = function ($dialog) { 
       var $currentModals = $('.modal.in'); 
       if ($currentModals.length > 0) { // if we have active modals 
        $currentModals.one('hidden', function() { 
         // when they've finished hiding 
         $dialog.modal('show'); 
         $dialog.one('hidden', function() { 
          // when we close the dialog 
          $currentModals.modal('show'); 
   
         }); 
        }).modal('hide'); 
       } else { // otherwise just simply show the modal 
        $dialog.modal('show'); 
       } 
   }; 
   

नोट: मैं केवल श्रोता एक बार और नहीं करने के लिए आवेदन किया है $.one का उपयोग देखभाल करने के लिए के बारे में bind/unbind (on/off)

Answer 3

आप बूटस्ट्रैप फ़ाइलों को संशोधित (बिना, maxisam जवाब के पहले समाधान लागू कर सकते हैं यदि आप नहीं कर सकते , या नहीं करना चाहते हैं)।

बस बूटस्ट्रैप फ़ाइलों को शामिल करने के बाद कहीं भी इस पंक्ति को लिखें।

$.fn.modal.Constructor.prototype.enforceFocus = function() {}; 

नोट: यह केवल, बूटस्ट्रैप 3.

Answer 4

साथ नहीं बूटस्ट्रैप 2 के साथ परीक्षण किया गया है मैं इस एक ढेर का उपयोग कर हल किया।

var openmodals = []; 
$(function(){ 
    var ts = new Date().getTime(); 
    $("div.modal").each(function(d) { 
    ts++; 
    $(this).data("uid", ts); 
    }); 

    // after closing > 1 level modals we want to reopen the previous level modal 
    $('div.modal').on('show', function (d) { 
    openmodals.push({ 'id' : $(this).data("uid"), 'el' : this }); 
    if(openmodals.length > 1){ 
     $(openmodals[ openmodals.length - 2 ].el).modal('hide'); 
    } 
    }); 
    $('div.modal').on('hide', function (d) { 
    if(openmodals.length > 1){ 
     if(openmodals[ openmodals.length - 1 ].id == $(this).data("uid")){ 
      openmodals.pop(); // pop current modal 
      $(openmodals.pop().el).modal('show'); // pop previous modal and show, will be pushed on show 
     } 
    } else if(openmodals.length > 0){ 
     openmodals.pop(); // last modal closing, empty the stack 
    } 
    }); 
}); 

Answer 5

स्मार्टलोव का जवाब दुर्भाग्य से कम हो जाता है; यदि आप नो-ऑप $.fn.modal.Constructor.prototype.enforceFocus पर जा रहे हैं, तो आपको अपना मोडल बंद होने पर इसे रीसेट करना चाहिए;

// Since confModal is essentially a nested modal it's enforceFocus method 
// must be no-op'd or the following error results 
// "Uncaught RangeError: Maximum call stack size exceeded" 
// But then when the nested modal is hidden we reset modal.enforceFocus 
var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus; 

$.fn.modal.Constructor.prototype.enforceFocus = function() {}; 

$confModal.on('hidden', function() { 
    $.fn.modal.Constructor.prototype.enforceFocus = enforceModalFocusFn; 
}); 

$confModal.modal({ backdrop : false }); 

Answer 6

निम्नलिखित सीएसएस का प्रयास करें: निम्न हमारे कोड, जिसके बारे में मैं कोई हिचक उत्पादन में डाल दिया है से सीधे है। यह मेरे लिए काम किया।

span.select2-container { 
    z-index:10050; 
} 

Answer 7

बूटस्ट्रैप 4 के लिए, की जगह: $.fn.modal.Constructor.prototype.**enforceFocus** $.fn.modal.Constructor.prototype.**_enforceFocus**