दिलचस्प पोस्ट
आर में दशमलव स्थानों का प्रारूपण करना कस्टम परिसंपत्तियों को शामिल करने के लिए एपीके फ़ाइल को दोबारा लगाएं – उपयोग करने के लिए उपकरण का निर्माण क्या है? विज़ुअल स्टूडियो हमेशा App.config के लिए गलत xsd का चयन करता है स्वत: पूर्णांक = 'बंद' इनपुट प्रकार पासवर्ड पर काम नहीं कर रहा है और स्वत: पूर्ण करने के लिए इनपुट फ़ील्ड इसके ऊपर बना देता है रेक डीबी के बीच का अंतर: माइग्रेट डीबी: रीसेट और डीबी: स्कीमा: लोड WPF में बिटमैप इमेज ताला फ़ाइल है मैं टिक्स को डेट प्रारूप में कैसे रूपांतरित कर सकता / सकती हूं? अजगर में सेलेनियम वेबड्राइवर के साथ आंशिक स्क्रीनशॉट कैसे लें? एसक्यूएल सर्वर 2008 SQL सर्वर 2005 के लाभ? एंड्रॉइड: वर्तमान स्थान से गंतव्य तक रूट दिशानिर्देश Google नक्शे एपीआई V2 कैसे आकर्षित करें Android में ListView में पंक्ति को कैसे उजागर करें? वाई-फ़ाई पर एक एंड्रॉइड फोन से लाइव स्ट्रीम वीडियो manifest.xml फ़ाइल में एंड्रॉइड अनुमति के लिए उपयोग-अनुमति बनाम अनुमति कैसे दो पैटर्न के बीच लाइनों का चयन करने के लिए? जाँच करें कि डिवाइस में कैमरा है या नहीं?

JQuery का उपयोग करके बूटस्ट्रैप मोडल विंडो कैसे खोलें?

मैं ट्विटर बूटस्ट्रैप मोडल विंडो कार्यक्षमता का उपयोग कर रहा हूँ जब कोई मेरे फॉर्म पर सबमिट करता है, तो मैं फॉर्म में "सबमिट बटन" पर क्लिक करने के लिए मोडल विंडो दिखाना चाहता हूं।

<form id="myform" class="form-wizard"> <h2 class="form-wizard-heading">BootStap Wizzard Form</h2> <input type="text" value=""/> <input type="submit"/> </form> <!-- Modal --> <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">Modal header</h3> </div> <div class="modal-body"> <p>One fine body…</p> </div> <div class="modal-footer"> <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> <button class="btn btn-primary">Save changes</button> </div> </div> 

jQuery:

 $('#myform').on('submit', function(ev) { $('#my-modal').modal({ show: 'false' }); var data = $(this).serializeObject(); json_data = JSON.stringify(data); $("#results").text(json_data); $(".modal-body").text(json_data); // $("#results").text(data); ev.preventDefault(); }); 

Solutions Collecting From Web of "JQuery का उपयोग करके बूटस्ट्रैप मोडल विंडो कैसे खोलें?"

बूटस्ट्रैप के कुछ फ़ंक्शन हैं जिन्हें मैन्युअल रूप से मैन्युअल रूप से कहा जा सकता है:

 $('#myModal').modal('toggle'); $('#myModal').modal('show'); $('#myModal').modal('hide'); 

आप यहां अधिक देख सकते हैं: बूटस्ट्रैप मोडल घटक

विशेष रूप से विधियां अनुभाग

तो आपको बदलने की आवश्यकता होगी:

 $('#my-modal').modal({ show: 'false' }); 

सेवा मेरे:

 $('#myModal').modal('show'); 

यदि आप अपने खुद के कस्टम पॉपअप की तलाश कर रहे हैं, तो एक अन्य समुदाय सदस्य से सुझाए गए वीडियो यहां है:

https://www.youtube.com/watch?v=zK4nXa84Km4

इसके अतिरिक्त आप डेटा विशेषता के माध्यम से उपयोग कर सकते हैं

 <button type="button" data-toggle="modal" data-target="#myModal">Launch modal</button> 

इस विशेष मामले में आपको जावास्क्रिप्ट का उपयोग करने की आवश्यकता नहीं है।

आप यहां अधिक देख सकते हैं: http://getbootstrap.com/2.3.2/javascript.html#modals

अक्सर, जब $('#myModal').modal('show'); काम नहीं कर रहा है, यह दो बार jQuery को शामिल करने के कारण होता है JQuery 2 बार भी काम करने के लिए modals नहीं बनाता है।

इसे फिर से काम करने के लिए एक लिंक को निकालें।

इसके अलावा, कुछ प्लग इन त्रुटियों के कारण भी, इस मामले में जोड़ते हैं

 jQuery.noConflict(); $('#myModal').modal('show'); 

jQuery चयनकर्ता का उपयोग करते हुए बस किसी भी मानदंड को पारित किए बिना मोडल पद्धति को कॉल करें।

यहां उदाहरण दिया गया है:

 $('#modal').modal(); 

यदि आप jQuery के द्वारा एक मॉडेल कॉल करने के लिए लिंक के ऑनक्लिक फ़ंक्शन का उपयोग करते हैं, तो "href" शून्य नहीं हो सकता।

उदाहरण के लिए:

 ... ... <a href="" onclick="openModal()">Open a Modal by jQuery</a> ... ... ... ... <script type="text/javascript"> function openModal(){ $('#myModal').modal(); } </script> 

मॉडल नहीं दिखा सकता है सही कोड है:

 <a href="#" onclick="openModal()">Open a Modal by jQuery</a> 

पूरा समाधान यहां देखें:

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_js_modal_show&stacked=h

परिणाम प्राप्त करने के लिए आवश्यक आदेश में पुस्तकालयों को रखना सुनिश्चित करें:

1- पहले बूटस्ट्रैप.मैंसीएसएस 2- jquery.min.js 3- बूटस्ट्रैप.मनी.जेएस

(दूसरे शब्दों में jquery.min.js को bootstrap.min.js से पहले कॉल करना चाहिए)

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"> </script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 

दस्तावेज़ तैयार होने पर बूटस्ट्रैप अलर्ट लोड करने का तरीका यहां है। यह बहुत आसान है बस जोड़ें

  $(document).ready(function(){ $("#myModal").modal(); }); 

मैंने W3Schools पर एक डेमो बनाया

 <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h2>Here is how to load a bootstrap modal as soon as the document is ready </h2> <!-- Trigger the modal with a button --> <!-- Modal --> <div class="modal fade" id="myModal" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Modal Header</h4> </div> <div class="modal-body"> <p>Some text in the modal.</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> </div> <script> $(document).ready(function(){ $("#myModal").modal(); }); </script> </body> </html> 

मैंने कई तरीकों की कोशिश की जो विफल हुई, लेकिन नीचे एक आकर्षण की तरह मेरे लिए काम किया:

 $('#myModal').appendTo("body").modal('show'); 
 <form id="myform" class="form-wizard"> <h2 class="form-wizard-heading">BootStap Wizzard Form</h2> <input type="text" value=""/> <input type="submit" id="submitButton"/> </form> <!-- Modal --> <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">Modal header</h3> </div> <div class="modal-body"> <p>One fine body…</p> </div> <div class="modal-footer"> <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> <button class="btn btn-primary">Save changes</button> </div> </div> 

आप नीचे दिए गए कोड के साथ मॉडल को लॉन्च कर सकते हैं।

 $(document).ready(function(){ $("#submitButton").click(function(){ $("#myModal").modal(); }); }); 

प्रयत्न

 $("#myModal").modal("toggle") 

Id myModal के साथ मॉडल को खोलने या बंद करने के लिए

यदि उपर्युक्त काम नहीं कर रहा है तो इसका अर्थ है कि bootstrap.js को कुछ अन्य जेएस फ़ाइल द्वारा ओवरराइड किया गया है। यहाँ एक समाधान है

1: – नीचे bootstrap.js को ले जाएं ताकि यह अन्य जेएस फाइलों को ओवरराइड कर सके।

2: – सुनिश्चित करें कि ऑर्डर नीचे की तरह है

 <script src="plugins/jQuery/jquery-2.2.3.min.js"></script> <!-- Other js files --> <script src="plugins/jQuery/bootstrap.min.js"></script>