jQuery UI डायलॉग बॉक्स - बंद होने के बाद नहीं खुलता है

Question

मुझे इससे समस्या है jquery-ui dialog box ।

समस्या यह है कि जब मैं संवाद बॉक्स को बंद करता हूं और तब मैं उस लिंक पर क्लिक करता हूं जो इसे ट्रिगर करता है, यह तब तक पॉप-अप नहीं होता जब तक कि मैं पृष्ठ को ताज़ा नहीं करता।

वास्तविक पृष्ठ को ताज़ा किए बिना मैं संवाद बॉक्स को वापस कैसे कह सकता हूं।

नीचे मेरा कोड है:

$(document).ready(function() {
    $('#showTerms').click(function()
    {
        $('#terms').css('display','inline');
        $('#terms').dialog({
            resizable: false,
            modal: true,
            width: 400,
            height: 450,
            overlay: { backgroundColor: "#000", opacity: 0.5 },
            buttons:{ "Close": function() { $(this).dialog("close"); } },
            close: function(ev, ui) { $(this).remove(); },
    }); 
});

धन्यवाद

Answer 1

आप वास्तव में $("#terms").dialog({ autoOpen: false });इसे इनिशियलाइज़ करने के लिए उपयोग करने वाले हैं। तब आप $('#terms').dialog('open');संवाद खोलने के लिए, और $('#terms').dialog('close');इसे बंद करने के लिए उपयोग कर सकते हैं ।

Comments

यह पूरी तरह से काम करता है। JQuery UI दस्तावेज़ यहाँ बहुत स्पष्ट नहीं हैं। लेकिन विचार यह है कि यह dialogकार्य मेरे लिए इसके अर्थ को समझने, दिखाने और छिपाने के लिए है। धन्यवाद।

— स्टीव कूपर

यदि आप HTML से इस संवाद को लोड कर रहे हैं जो गतिशील रूप से बदल सकता है, तो यह बहुत ही अनपेक्षित है कि यह काम क्यों नहीं करता है। किसी के पास कोई अच्छा समाधान है जो इन स्थितियों के लिए उदारतापूर्वक लागू किया जा सकता है?

— मिलीमीटर

@ माइलीमेट्रिक आप हमेशा $ (इस) .remove () का उपयोग कर सकते हैं; अपने प्रत्येक संवाद के अंत में कार्य करें, इस तरह से पूरे संवाद को फिर से कॉल करने पर खरोंच से पूरी तरह से हटा दिया जाएगा। ध्यान दें कि यह फ़ंक्शन $ (इस) .dialog ("नष्ट") से अलग कार्य करता है; चूंकि यह केवल वस्तु को नष्ट किए बिना, डायलॉग को उसके प्री-इनिट अवस्था में वापस सेट करता है।

— जेफ नोएल

Answer 2

मैंने इसे हल किया।

मैंने क्लोज़ फंक्शन के बजाय नष्ट किया (इसका कोई मतलब नहीं है), लेकिन यह काम किया।

$(document).ready(function() {
$('#showTerms').click(function()
{
    $('#terms').css('display','inline');
    $('#terms').dialog({resizable: false,
        modal: true,
        width: 400,
        height: 450,
        overlay: { backgroundColor: "#000", opacity: 0.5 },
        buttons:{ "Close": function() { $(this).dialog('**destroy**'); } },
        close: function(ev, ui) { $(this).close(); },
    });         
});   
$('#form1 input#calendarTEST').datepicker({ dateFormat: 'MM d, yy' });
});

Comments

यदि आप उस विधि का उपयोग करते हैं, तो नष्ट हो जाएंगे, लेकिन काम बंद करने के लिए (), पहले डायलॉग को फिर से लिखें, फिर उसे दिखाने के लिए Dial.show () का उपयोग करें, फिर डायल करें। क्लोज़ () इसे बंद करें, और यह बिना किसी समस्या के फिर से खुल जाएगा ।

— राहीलहमान

लगभग। आप इसे पहले initilizing के बारे में सही हैं, लेकिन इसके बाद यह .dialog ("ओपन") और .dialog ("करीब")

— rdworth

Answer 3

अंतिम पंक्ति पर, उपयोग न $(this).remove()करें$(this).hide() इसके बजाय ।

संपादित करें: स्पष्ट करने के लिए, क्लोज़ क्लिक ईवेंट पर आप #termsडीओएम को डीओ से हटा रहे हैं , यही कारण है कि इसकी वापसी नहीं हो रही है। आपको बस इसे छिपाने की आवश्यकता है।

Answer 4

मेरा मानना ​​है कि आप केवल एक बार संवाद आरंभ कर सकते हैं। ऊपर दिया गया उदाहरण हर बार #terms क्लिक होने पर संवाद को आरंभ करने का प्रयास कर रहा है। इससे समस्याएं पैदा होंगी। इसके बजाय, क्लिक घटना के बाहर इनिशियलाइज़ेशन होना चाहिए। आपका उदाहरण शायद कुछ इस तरह दिखना चाहिए:

$(document).ready(function() {
    // dialog init
    $('#terms').dialog({
        autoOpen: false,
        resizable: false,
        modal: true,
        width: 400,
        height: 450,
        overlay: { backgroundColor: "#000", opacity: 0.5 },
        buttons: { "Close": function() { $(this).dialog('close'); } },
        close: function(ev, ui) { $(this).close(); }
    });
    // click event
    $('#showTerms').click(function(){
        $('#terms').dialog('open').css('display','inline');      
    });
    // date picker
    $('#form1 input#calendarTEST').datepicker({ dateFormat: 'MM d, yy' });
});

मैं सोच रहा हूं कि एक बार जब आप यह स्पष्ट कर दें कि यह आपके द्वारा वर्णित मुद्दे से link लिंक से खुला ’को ठीक कर दे।

Answer 5

मेरे लिए यह दृष्टिकोण काम करता है:

संवाद पर एक्स क्लिक करके या 'बेवरन' पर क्लिक करके संवाद बंद किया जा सकता है। मैं एक (मनमानी) आईडी जोड़ रहा हूं क्योंकि मुझे यह सुनिश्चित करने की आवश्यकता है कि डोम में जोड़े गए प्रत्येक बिट को बाद में हटा दिया जाए।

$('<div id="dossier_edit_form_tmp_id">').html(data.form)
.data('dossier_id',dossier_id)
.dialog({
        title: 'Opdracht wijzigen',
        show: 'clip',
        hide: 'clip',
        minWidth: 520,
        width: 520,
        modal: true,
        buttons: { 'Bewaren': dossier_edit_form_opslaan },
        close: function(event, ui){ 
                                  $(this).dialog('destroy'); 
                                  $('#dossier_edit_form_tmp_id').remove();
               }
});

Answer 6

 <button onClick="abrirOpen()">Open Dialog</button>

<script type="text/javascript">
var $dialogo = $("<div></div>").html("Aqui tu contenido(here your content)").dialog({
       title: "Dialogo de UI",
       autoOpen: false,
       close: function(ev, ui){
               $(this).dialog("destroy");
       }
 function abrirOpen(){
       $dialogo.dialog("open");
 }
});

//**Esto funciona para mi... (this works for me)**
</script>

Answer 7

यह एक सुपर पुराना धागा है, लेकिन जवाब के बाद भी "यह कोई मतलब नहीं है", मैंने सोचा कि मैं जवाब जोड़ूंगा ...

मूल पोस्ट का उपयोग $ (यह) .remove (); क्लोज हैंडलर में, यह वास्तव में DOM से डायलॉग डिव को हटा देगा। एक डायलॉग को फिर से शुरू करने का प्रयास फिर से काम नहीं करेगा क्योंकि डिव को हटा दिया गया था।

$ (इस) .dialog ('नष्ट') का उपयोग करके डायलॉग ऑब्जेक्ट में परिभाषित विधि को नष्ट कर रहा है जो इसे DOM से नहीं हटाता है।

प्रलेखन से:

नष्ट करना ()

संवाद कार्यक्षमता को पूरी तरह से हटा देता है। यह तत्व को वापस उसके >> पूर्व-इनिट अवस्था में लौटा देगा। यह विधि किसी भी तर्क को स्वीकार नहीं करती है।

कहा कि, यदि आप के पास एक अच्छा कारण है तो केवल नष्ट या बंद करें।

Answer 8

$(this).dialog('destroy');

काम करता है!

Answer 9

.close () मोर सामान्य है और इसका उपयोग अधिक वस्तुओं के संदर्भ में किया जा सकता है। .dialog ('करीब') केवल संवादों के साथ उपयोग किया जा सकता है

Answer 10

मैं डायलॉग फ़ाइल ब्राउज़र और अपलोडर के रूप में संवाद का उपयोग करता हूं फिर मैं इस तरह कोड को फिर से लिखता हूं

var dialog1 = $("#dialog").dialog({ 
              autoOpen: false, 
              height: 480, 
              width: 640 
}); 
$('#tikla').click(function() {  
    dialog1.load('./browser.php').dialog('open');
});   

सब कुछ बहुत अच्छा लगता है।

Answer 11

मुझे jquery-ui ओवरले डायलॉग बॉक्स के साथ एक ही समस्या थी - यह केवल एक बार काम करेगा और तब तक रुकेगा जब तक मैं पृष्ठ को पुनः लोड नहीं करता। मुझे उनके एक उदाहरण में जवाब मिला -
एक ही पृष्ठ पर कई
बहने
- हालांकि, सही कौन होगा ?? :-) -

महत्वपूर्ण सेटिंग दिखाई दी

oneInstance: false

तो, अब मैं इसे इस तरह है -

$(document).ready(function() {

 var overlays = null;

 overlays = jQuery("a[rel]");

 for (var n = 0; n < overlays.length; n++) {

    $(overlays[n]).overlay({
        oneInstance: false, 
        mask: '#669966',
        effect: 'apple',
        onBeforeLoad: function() {
            overlay_before_load(this);
        }
    });

  }

}

और सब कुछ ठीक काम करता है

आशा है कि यह किसी की मदद करता है

ओ

Answer 12

JQuery के प्रलेखन में इस लेख का लिंक है ' jQuery UI संवाद का मूल उपयोग ' जो इस स्थिति को बताता है और इसे कैसे हल किया जाए।