2013-01-10 52 views
8

हाय मैं चहचहाना बूटस्ट्रैप क्रियार्थ द्योतक के लिए डिफ़ॉल्ट सेट बंद नहीं करने के लिए पृष्ठभूमिकैसे पृष्ठभूमि पर क्लिक (ट्विटर बूटस्ट्रैप) द्वारा मोडल बंद करने के लिए

$.fn.modal.defaults = { 
    backdrop: 'static' 
    , keyboard: false 
    , show: false 
} 

हालांकि पर उपयोगकर्ता क्लिक करता है, वहाँ एक विशेष परिदृश्य है जब जिससे मैं मोडल को बंद करने के लिए उपयोगकर्ता को पृष्ठभूमि पर क्लिक करने की अनुमति देने के लिए इस डिफ़ॉल्ट को ओवरराइट करने की आवश्यकता है।

मैं इसे अधिलेखित करना जब विशेष मोडल

//Modal to be displayed and allow user to close it by clicking on background 
view = new Onethingaday.Views.Muses.MuseModalView 
    model: @options.muse 

$('.modal').html view.render().el 
$('.modal').bind 'shown', => 
    $('.modal').modal 
    'backdrop': true 
    ('.modal').unbind 'show' 
$('.modal').modal('show') 

लेकिन, मेरा कोड से काम नहीं होता प्रदर्शित करने की कोशिश की। किसी को भी कोई विचार है कि इसे काम करने के लिए कोड को कैसे संशोधित किया जा सकता है। साथ ही, ऊपर दिया गया कोड ऐप में मेरे सभी मॉडलों के डिफ़ॉल्ट व्यवहार को बदल रहा है जो कि मैं नहीं चाहता हूं। मैं इस विशेष मोडल (यानी MuseModalView) के लिए बैकड्रॉप कैसे बदलूं? धन्यवाद!

+1

क्या आपने 'विकल्प' के साथ मोडल प्रारंभ करने का प्रयास किया है? पसंद: '$ ('# myModal')। मोडल ({ बैकड्रॉप: सत्य });' – dunli

उत्तर

7

मैं आज भी इसी तरह की समस्या से निपट रहा था। सबसे पहले, मुझे यह चर्चा मिली: https://github.com/twitter/bootstrap/issues/1202। किसी ने झूठी पर isShown की स्थापना, पृष्ठभूमि क्लिक पर बंद करने से मोडल विंडो को रोकने के लिए सुझाव:

$('myelement').data('modal').isShown = false 

मैं कह नहीं कर सकते कि मैं हैक पसंद आया है, खासकर जब मुझे पता चला कि मोडल विंडो पर ठीक से बंद नहीं होती है ठीक/रद्द करें बटन पर क्लिक करें - जबकि isShown गलत पर सेट है। मैं एक बेहतर समाधान नहीं मिल सकता है, तो मैं ऐसा किया: मैं वैश्विक चूक पृष्ठभूमि सेट करें: "स्थिर" (पृष्ठभूमि क्लिक पर करीब निष्क्रिय) और इस कोड को कहा:

$('#myModal').on('shown', function() { 
    $("div.modal-backdrop").on('click', function() { 
     if(myCondition == true) { 
     $('#myModal').modal('hide'); 
     } 
    }) 
    }); 

वर्ग मोडल-पृष्ठभूमि के साथ div है मोडल विंडो खोले जाने पर गतिशील रूप से शरीर में जोड़ा जाता है, और बंद होने पर हटा दिया जाता है - प्रत्येक मोडल विंडो के लिए। इसका मतलब है कि हमें यह सुनिश्चित करना चाहिए कि अगर हम मोडल विंडो को ढेर करते हैं तो हम इसे ठीक से संभाल लेंगे।

$('#myModal').on('shown', function() { 
    $("div.modal-backdrop").each(function(){ 
     if($(this).data('wired') !== 'true'){ 
     $(this).on('click', function() { 
      if(myCondition == true){ 
      $('#myModal').modal('hide'); 
      } 
     }).data('wired', true); 
     } 
    }) 
    }); 

इस कोड को मोडल विंडो बंद हो जाना चाहिए केवल जब myCondition सच है: तो, मैं अपने ऊपरी कोड एक छोटा सा समायोजित। यह मेरे लिए ठीक काम करना चाहिए, और मुझे उम्मीद है कि यह आपको और किसी और की मदद करेगा जो समान समस्या को पूरा करेगा।

 संबंधित मुद्दे

  • कोई संबंधित समस्या नहीं^_^