किसी डायलॉग को पूरी तरह से कैसे हटाएं

Question

जब अजाक्स ऑपरेशन विफल हो जाता है, तो मैं त्रुटियों के साथ एक नया div बनाता हूं और फिर इसे एक संवाद के रूप में दिखाता हूं। जब संवाद बंद हो जाता है तो मैं पूरी तरह से नष्ट कर देना चाहता हूं और फिर से डिव को हटा दूंगा। मैं यह कैसे कर सकता हूँ? मेरा कोड इस समय कुछ इस तरह है:

$('<div>We failed</div>')
    .dialog(
    {
        title: 'Error',
        close: function(event, ui)
        {
            $(this).destroy().remove();
        }
    });

जब मैं इसे चलाता हूं तो संवाद बॉक्स सही तरीके से दिखाई देता है, लेकिन जब मैं इसे बंद करता हूं तो डायलॉग अभी भी html (फायरबग का उपयोग करके) में दिखाई देता है। मुझे यहां क्या समझ नहीं आ रहा है? कुछ मैं भूल गया हूँ?

अद्यतन: बस देखा कि मेरा कोड मुझे फायरबग कंसोल में एक त्रुटि देता है।

$ (यह) .destroy एक फ़ंक्शन नहीं है

किसी को भी मेरी मदद करने में सक्षम?

अद्यतन: यदि मैं $(this).remove()इसके बजाय करता हूं , तो आइटम html से हटा दिया जाता है। लेकिन क्या इसे पूरी तरह से डोम से हटा दिया गया है? या क्या मुझे किसी तरह उस कॉल को नष्ट करने की ज़रूरत है जो पहले फ़ंक्शन को नष्ट कर दे?

Answer 1

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

यह संवाद को नष्ट कर देगा और फिर उस डायल को हटा देगा जो डायल को डोम से पूरी तरह से "होस्ट" कर रहा था

Comments

एफएफ के साथ और फायरबग के साथ इसका उपयोग करने के कारण यह खुल गया। यह दुर्घटनाग्रस्त हो जाएगा। code.google.com/p/fbug/issues/detail?id=6290 मैंने घंटों बिताए ... यह जानने के लिए कि मेरे कोड में क्या गलत है।

— Hendry H.

यदि आप DOM से div का उपयोग कर रहे हैं, तो गतिशील रूप से निर्मित नहीं, उपयोग करें .empty()। फिर आप इसे फिर से उपयोग कर सकते हैं, यदि आप सामग्री को फिर से ऑफकोर्स भरते हैं।

— कोअलाअर जुआर

@ हेंड्रीएच।, कि अब फ़ायरफ़ॉक्स 23.0 और फायरबग 1.11.4 के साथ कोई समस्या नहीं है।

— cjm

है destroyआवश्यक? तत्व को हटाने से संवाद भी नष्ट नहीं होगा?

— ड्रूस्का

देखें: stackoverflow.com/questions/9124389/…

— gaefan

Answer 2

आप इसे क्यों निकालना चाहते हैं?

यदि यह कई उदाहरणों को बनाए जाने से रोकना है, तो बस निम्नलिखित दृष्टिकोण का उपयोग करें ...

$('#myDialog') 
    .dialog( 
    { 
        title: 'Error', 
        close: function(event, ui) 
        { 
            $(this).dialog('close');
        } 
    }); 

और जब त्रुटि होती है, तो आप ...

$('#myDialog').html("Ooops.");
$('#myDialog').dialog('open');

Comments

मुझे लगा कि यह आसान होगा, क्योंकि इसमें एक अलग सामग्री होगी जो मुझे अजाक्स कॉल से वापस मिलती है। और div भी स्थिर नहीं है जैसा मैंने अपने उदाहरण में दिखाया है लेकिन github.com/nje/jquery-tmpl प्लगइन द्वारा प्रस्तुत किया गया है । यदि आपके पास संवाद की सामग्री को अदला-बदली करने का एक अच्छा तरीका है, तो मुझे यह देखने में दिलचस्पी होगी कि :) :)

— सविश

खैर, मेरे उदाहरण में, मैं डायलॉग डिव के साथ एक स्ट्रिंग को डंप करने के बेहद सरल विकल्प के साथ गया: $ ('# myDialog')। html ("ऊओप्स।"); आप संवाद div में किसी भी उप-नियंत्रण की सामग्री को बदलने के लिए इसे संशोधित कर सकते हैं।

— फियोना - myaccessible.website

जब तक आप उन्हें विशेष रूप से ओवरराइड नहीं करते, यह सभी डायलॉग्स #myDialog पर बने रहेंगे, क्योंकि यह एक बढ़िया तरीका नहीं है। दूसरे संवाद में (हमेशा) एक ही बटन, ऊंचाई आदि नहीं होना चाहिए।

— मिकिएल कॉर्निल

Answer 3

$(dialogElement).empty();

$(dialogElement).remove();

यह असली के लिए इसे ठीक करता है

Answer 4

यह मेरे लिए काम किया है

$('<div>We failed</div>')
    .dialog(
    {
        title: 'Error',
        close: function(event, ui)
        {
            $(this).dialog("close");
            $(this).remove();
        }
    });

चीयर्स!

पुनश्च: मुझे कुछ इसी तरह की समस्या थी और उपरोक्त दृष्टिकोण ने इसे हल कर दिया।

Comments

आप बंद कॉलबैक के भीतर से बंद विधि को बुला रहे हैं! jQuery UI इस द्वारा सुझाए गए अनंत लूप को रोकने के लिए काफी स्मार्ट है, लेकिन यह अभी भी बेमानी है, और मैं निश्चित रूप से इसे सुरुचिपूर्ण नहीं मानूंगा।

— एलिजर

उत्तर लिखने के समय, बिना $(this).dialog("close");, संवाद बस नहीं चलेगा। jQuery कई बार बहुत अजीब होता है।

— deb_

Answer 5

एक बदसूरत समाधान जो मेरे लिए एक आकर्षण की तरह काम करता है:

$("#mydialog").dialog(
    open: function(){
        $('div.ui-widget-overlay').hide();
        $("div.ui-dialog").not(':first').remove();
}
});

Comments

अजीब तरह से इसके सभी काम। आप डायलॉग खोलें और तुरंत इसे हटा दें ...

— व्यवस्थाविवरण

Answer 6

आप उपयोग कर सकते हैं

$(dialogElement).empty();    
$(dialogElement).remove();

Answer 7

मैं अपने सभी js प्रोजेक्ट्स में इस फ़ंक्शन का उपयोग करता हूं

आप इसे कहते हैं: HideAndResetModals ("# IdModalDialog")

आप परिभाषित करते हैं कि:

function hideAndResetModals(modalID)
{
    $(modalID).modal('hide');
    clearValidation(modalID); //You implement it if you need it. If not, you can remote this line
    $(modalID).on('hidden.bs.modal', function () 
    {
        $(modalID).find('form').trigger('reset');  
    });
}