2010-08-19 17 views
88

मैं चाहता हूँ हाँ/jQuery का उपयोग कर कोई अलर्ट नहीं, बजाय ठीक से/रद्द करें बटन का उपयोग:हाँ या नहीं की पुष्टि बॉक्स jQuery

jQuery.alerts.okButton = 'Yes'; 
jQuery.alerts.cancelButton = 'No';     
jConfirm('Are you sure??', '', function(r) { 
    if (r == true) {      
     //Ok button pressed... 
    } 
} 

किसी भी अन्य विकल्प?

+2

ड्यूप, http://stackoverflow.com/questions/3166036/how-to-develop-yes -no-confirmation-use-jquery –

+0

या http://stackoverflow.com/questions/3165559/confirmation-model-dialog-in-javascript/3165601#3165601 –

+0

यह पोस्ट कोड काम करता है? मैं 'jQuery' के साथ क्या बदलूँगा? यह मेरे लिए काम नहीं कर रहा है ... मुझे लगता है कि मैं $ का उपयोग करूंगा लेकिन कैसे? वाक्यविन्यास – sqlchild

उत्तर

96
ConfirmDialog('Are you sure'); 

function ConfirmDialog(message) { 
    $('<div></div>').appendTo('body') 
    .html('<div><h6>'+message+'?</h6></div>') 
    .dialog({ 
     modal: true, title: 'Delete message', zIndex: 10000, autoOpen: true, 
     width: 'auto', resizable: false, 
     buttons: { 
      Yes: function() { 
       // $(obj).removeAttr('onclick');         
       // $(obj).parents('.Parent').remove(); 

       $('body').append('<h1>Confirm Dialog Result: <i>Yes</i></h1>'); 

       $(this).dialog("close"); 
      }, 
      No: function() {                 
       $('body').append('<h1>Confirm Dialog Result: <i>No</i></h1>'); 

       $(this).dialog("close"); 
      } 
     }, 
     close: function (event, ui) { 
      $(this).remove(); 
     } 
    }); 
}; 

कृपया Demo खोजें।

+1

यह jquery-ui या सादे पुरानी jquery है? मुझे नहीं पता .dialog () jQuery के documentaiton पर कहीं भी। – chovy

+10

आपको अपने पृष्ठ में jquery और jquery ui स्क्रिप्ट को शामिल करने की आवश्यकता है। – Thulasiram

1

मैं मुसीबत जवाब संवाद बॉक्स से वापस हो रही थी लेकिन अंत में मोडल-पुष्टिकरण संवाद से कोड का हिस्सा के साथ इस अन्य प्रश्न display-yes-and-no-buttons-instead-of-ok-and-cancel-in-confirm-box से जवाब के संयोजन के द्वारा एक समाधान के साथ आया था

यह क्या था है

अपनी खुद की पुष्टि बॉक्स बनाएँ::

<div id="confirmBox"> 
    <div class="message"></div> 
    <span class="yes">Yes</span> 
    <span class="no">No</span> 
</div> 

अपनी खुद की confirm() विधि बनाएं:

अन्य प्रश्न के लिए सुझाव 10
function doConfirm(msg, yesFn, noFn) 
{ 
    var confirmBox = $("#confirmBox"); 
    confirmBox.find(".message").text(msg); 
    confirmBox.find(".yes,.no").unbind().click(function() 
    { 
     confirmBox.hide(); 
    }); 
    confirmBox.find(".yes").click(yesFn); 
    confirmBox.find(".no").click(noFn); 
    confirmBox.show(); 
} 

यह आपके कोड से कॉल:

doConfirm("Are you sure?", function yes() 
{ 
    form.submit(); 
}, function no() 
{ 
    // do nothing 
}); 

मेरे परिवर्तन मैं confirmBox.show() बुलाने की ताकि बजाय ऊपर फेरबदल किया है मैं इस

confirmBox.dialog 
    ({ 
     autoOpen: true, 
     modal: true, 
     buttons: 
     { 
      'Yes': function() { 
      $(this).dialog('close'); 
      $(this).find(".yes").click(); 
      }, 
      'No': function() { 
      $(this).dialog('close'); 
      $(this).find(".no").click(); 
      } 
     } 
    }); 

अन्य परिवर्तन की तरह इस्तेमाल किया confirmBox.dialog({...}) मैंने doConfirm फ़ंक्शन के भीतर पुष्टि बॉक्स को बनाने के लिए बनाया था, जैसे ThulasiRam ने अपने उत्तर में किया था।

10

मैंने जो भी उदाहरण देखा है वह अलग-अलग "हां/नहीं" प्रकार के प्रश्नों के लिए पुन: प्रयोज्य नहीं है। मैं ऐसा कुछ ढूंढ रहा था जो मुझे कॉलबैक निर्दिष्ट करने की अनुमति दे ताकि मैं किसी भी स्थिति के लिए फोन कर सकूं।

निम्नलिखित मेरे लिए अच्छी तरह से काम कर रहा है:

$.extend({ confirm: function (title, message, yesText, yesCallback) { 
    $("<div></div>").dialog({ 
     buttons: [{ 
      text: yesText, 
      click: function() { 
       yesCallback(); 
       $(this).remove(); 
      } 
     }, 
     { 
      text: "Cancel", 
      click: function() { 
       $(this).remove(); 
      } 
     } 
     ], 
     close: function (event, ui) { $(this).remove(); }, 
     resizable: false, 
     title: title, 
     modal: true 
    }).text(message).parent().addClass("alert"); 
} 
}); 

मैं तो इसे इस तरह कहते हैं: jquery.confirm:

var deleteOk = function() { 
    uploadFile.del(fileid, function() {alert("Deleted")}) 
}; 

$.confirm(
    "CONFIRM", //title 
    "Delete " + filename + "?", //message 
    "Delete", //button text 
    deleteOk //"yes" callback 
); 
28

इस jQuery प्लगइन पर एक नज़र डालें।

<a href="home" class="confirm">Go to home</a> 

और उसके बाद:

$(".confirm").confirm(); 

इस लिंक का पालन करने के लिए आगे बढ़ने से पहले एक पुष्टि पॉपअप दिखाई देगा।

यहाँ एक डेमो है: http://myclabs.github.com/jquery.confirm/

77

उपयोगकर्ता जब तक चेतावनी विधि ब्लॉक निष्पादन यह बंद कर देता है:

if (confirm('Some message')) { 
    alert('Thanks for confirming'); 
} else { 
    alert('Why did you press cancel? You should have confirmed'); 
} 
33

मैं इन कोड का उपयोग किया है::

पुष्टि फ़ंक्शन का उपयोग करें

एचटीएमएल:

<a id="delete-button">Delete</a> 

jQuery:

<script> 
$("#delete-button").click(function(){ 
    if(confirm("Are you sure you want to delete this?")){ 
     $("#delete-button").attr("href", "query.php?ACTION=delete&ID='1'"); 
    } 
    else{ 
     return false; 
    } 
}); 
</script> 

ये कोड मेरे लिए काम करता है, लेकिन मैं वास्तव में यकीन है कि अगर यह उचित है नहीं कर रहा हूँ। तुम क्या सोचते हो?

-2

आप अपने पुष्टि पुन: उपयोग कर सकते हैं:

function doConfirm(body, $_nombrefuncion) 
    { var param = undefined; 
     var $confirm = $("<div id='confirm' class='hide'></div>").dialog({ 
      autoOpen: false, 
      buttons: { 
       Yes: function() { 
       param = true; 
       $_nombrefuncion(param); 
       $(this).dialog('close'); 
      }, 
       No: function() { 
       param = false; 
       $_nombrefuncion(param); 
       $(this).dialog('close'); 
      } 
            } 
     }); 
     $confirm.html("<h3>"+body+"<h3>"); 
     $confirm.dialog('open');          
    }; 

// for this form just u must change or create a new function for to reuse the confirm 
    function resultadoconfirmresetVTyBFD(param){ 
     $fecha = $("#asigfecha").val(); 
     if(param ==true){ 
       // DO THE CONFIRM 
     } 
    } 

//Now just u must call the function doConfirm 
    doConfirm('body message',resultadoconfirmresetVTyBFD); 
+1

कृपया, सही अंग्रेजी का उपयोग करें और "यू" जैसे संक्षेप से बचें। इसके अलावा, यह शर्त है अगर आप ओपी को चित्रित और शिक्षित करने के लिए अपना कोड थोड़ा सा समझा सकते हैं, और आपको लगता है कि आपका उत्तर पहले पोस्ट किए गए किसी भी से बेहतर है। – Davidmh

0

मैं ठीक करने के लिए एक अनुवाद लागू करते हैं और बटन रद्द की जरूरत है। मैं गतिशील पाठ सिवाय करने के लिए कोड को संशोधित (कॉल मेरे अनुवाद समारोह)


$.extend({ 
 
    confirm: function(message, title, okAction) { 
 
     $("<div></div>").dialog({ 
 
      // Remove the closing 'X' from the dialog 
 
      open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); }, 
 
      width: 500, 
 
      buttons: [{ 
 
       text: localizationInstance.translate("Ok"), 
 
       click: function() { 
 
        $(this).dialog("close"); 
 
        okAction(); 
 
       } 
 
      }, 
 
       { 
 
       text: localizationInstance.translate("Cancel"), 
 
       click: function() { 
 
        $(this).dialog("close"); 
 
       } 
 
      }], 
 
      close: function(event, ui) { $(this).remove(); }, 
 
      resizable: false, 
 
      title: title, 
 
      modal: true 
 
     }).text(message); 
 
    } 
 
});

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