ट्विटर बूटस्ट्रैप मॉडल के आवेदक तत्व को कैसे प्राप्त करें?

Question

मैं लागू मॉडल के लिए एक a तत्व मिल गया है:

<a class="btn" data-toggle="modal" data-target="#myModal" href="http://some-url" >Launch Modal</a> 

और, कहते हैं कि यह मेरा मोडल है:

$('#myModal').on('hidden', function() { 
    // do something… 
}) 

:

<div class="modal hide" id="myModal"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal">×</button> 
    <h3>Modal header</h3> 
    </div> 
    <div class="modal-body"> 
    <p>One fine body…</p> 
    </div> 
    <div class="modal-footer"> 
    <a href="#" class="btn" data-dismiss="modal">Close</a> 
    <a href="#" class="btn btn-primary">Save changes</a> 
    </div> 
</div> 

मैं मोडल से निकाल दिया घटनाओं के लिए काम करता है बाध्य कर सकते हैं

मेरा सवाल है: मैं a तत्व का उपयोग कैसे कर सकता हूं - जिसने मेरे ईवेंट ग्राहक फ़ंक्शन से मोडल को आमंत्रित किया?

Answer 1

यह बूटस्ट्रैप 3.0.0 में हल किया गया था event.relatedTarget के लिए धन्यवाद।

$('#your-modal').on('show.bs.modal', function (e) { 
    var $invoker = $(e.relatedTarget); 
}); 

Answer 2

वर्तमान में यह बॉक्स के बाहर उपलब्ध नहीं है। यदि आप बूटस्ट्रैप-मोडल कोड को स्वयं संपादित करना चाहते हैं तो इसके लिए एक फीचर अनुरोध और एक कार्य-आसपास है।

देखें here

Answer 3

मैं एक स्थिति थी, जहां मैं "invoker" से संबंधित कुछ डेटा बाध्य करने के लिए किया था, जैसा कि आप ने कहा।

invoker

<img id="element" src="fakepath/icon-add.png" title="add element" data-toggle="modal" data-target="#myModal" class="add"> 

जे एस invoker से संबंधित डेटा को पकड़ने के लिए: मैं इसे करने के लिए एक "क्लिक" घटना बंधन और इस तरह डेटा के साथ काम करके इसे हल करने प्रबंधित किया है (बस कुछ कोड उदाहरण)

$('#element').on('click', function() { // Had to use "on" because it was ajax generated content (just an example) 
    var self = $(this); 
}); 

इस तरह, आप अपनी invoker से संबंधित डेटा संभाल कर सकते हैं वैसे भी आप चाहते हैं।

$('[data-toggle="modal"]').on('click', function() { 
    $($(this).attr('href')).data('trigger', this); 
}); 
$('.modal').on('show.bs.modal', function() { 
    console.log('Modal is triggered by ' + $(this).data('trigger')); 
}); 

आप निश्चित रूप से जगह ले सकता है show.bs.modal साथ shown.bs.modal या किसी अन्य घटना वे आग:

Answer 4

आप को सुनने के लिए है। ध्यान दें कि यह बूटस्ट्रैप 3.0.0 के लिए है। यदि आप 2.3.2 का उपयोग कर रहे हैं तो आपको से छुटकारा पाना होगा .bs.modal (मुझे लगता है)।

क्या मैं इस समाधान के बारे में की तरह है: तुम कौन है इस, स्वयं, कि और अन्य प्रॉक्सी समाधान कॉल याद करने की जरूरत नहीं है।

बेशक, आपको यह जांचना होगा कि href विशेषता वास्तविक लिंक नहीं है (गतिशील मोडल लोडिंग विकल्प)।

Answer 5

मोडल तत्व modal नामक डेटा उद्देश्य यह है कि सभी विकल्प है कि पारित कर रहे हैं बचाता है। आप उस तत्व पर 'स्रोत' डेटा विशेषता सेट कर सकते हैं जो मोडल को ट्रिगर करता है, इसे स्रोत की आईडी पर सेट करता है, और उसके बाद इसे बाद में options चर से पुनर्प्राप्त करता है।

ट्रिगर होगा:

<a id="launch-modal-1" class="btn" data-toggle="modal" data-target="#myModal" href="http://some-url" data-source="#launch-modal-1">Launch Modal</a> 

घटना कॉलबैक में, modal डेटा वस्तु मिलता है, और source विकल्प को देखो:

$('#myModal').on('hidden', function() { 
    var modal = $(this).data('modal'); 
    var $trigger = $(modal.options.source); 
    // $trigger is the #launch-modal-1 jQuery object 
});