jQuery Ertelendi ve İletişim kutusu

Question

function ValidateField(){ 
var bAllow= true; 

    //some checking here 

if (bAllow == true && apl.val().trim() == "") 
{ 
    showDialog(); 
    showDialog().done(function() { 
     return true; // wanna return true, but not success 
    }).fail(function() { 
     return false; //wanna return false, but not success 
    }); 
    return false; //stop it to execute to next line 
} 
return bAllow; //success return } 

function showDialog(){ 
var def = $.Deferred(); 
var modPop = '<div id="diaCom" title="Information?"><p>something something</p></div>'; 
$("#diaCom").remove(); 
$(modPop).appendTo('body'); 
$("#diaCom").dialog({ 
    resizable: false, 
    draggable: false, 
    height:150, 
    width:300, 
    modal: true, 
    buttons: { 
     "Ok": function() { 
      def.resolve(); 
      $(this).dialog("close"); 

     }, 
     "Cancel": function() { 
      def.reject(); 
      $(this).dialog("close"); 

     } 
    } 
}); 

return def.promise(); 
} 
//on click 
if (validateField() == true){ 
     //do something 
}else{ 
     //do something 
    } 

Herkese merhaba, değeri döndürme şansı var mı? ShowDialog(). Done() ile true ve false değerini döndürmek ve validatefield() işlevi için başarısız olmak istiyorum, ancak istediğim gibi çalışmaz, beklemek için yanlış bir dönüş yaptığım için bAllow'a atayamıyorum Bir sonraki satırı, herhangi bir fikir yürütmek için iletişim kutusu? Yoksa böyle yapmak doğru mu?

Answer 1

Bu işe yarayabilir. Bu çoğu insan için yanlış görünebilir

function onclick(){ 
    var question = "Do you want to start a war?"; 
    confirmation(question).then(function (answer) { 
     var ansbool = Boolean.parse(answer.toString()); 
     if(ansbool){ 
      alert("this is obviously " + ansbool);//TRUE 
     } else { 
      alert("and then there is " + ansbool);//FALSE 
     } 
    }); 
} 

Eğer işlevini kullanın

Kişisel iletişim fonksiyonu ... showDialog()

function confirmation(question) { 
    var defer = $.Deferred(); 
    $('<div></div>') 
     .html(question) 
     .dialog({ 
      autoOpen: true, 
      modal: true, 
      title: 'Confirmation', 
      buttons: { 
       "Yes": function() { 
        defer.resolve("true");//this text 'true' can be anything. But for this usage, it should be true or false. 
        $(this).dialog("close"); 
       }, 
       "No": function() { 
        defer.resolve("false");//this text 'false' can be anything. But for this usage, it should be true or false. 
        $(this).dialog("close"); 
       } 
      }, 
      close: function() { 
       $(this).remove(); 
      } 
     }); 
    return defer.promise(); 
} 

ve sonra kodu .... Ama her zaman JQuery Dialog'dan dönüş yapamayacağınız bazı durumlar vardır.

Bu, esas olarak confirm() işlevini taklit eder. Ama çirkin bir kod ve güzel bir onay kutusu ile bakın :)

Umarım bu bazı insanlara yardımcı olur.

---

DÜZENLEME: 3 Çözüm

---

Önyükleme şimdi NakuPanda's önyükleme kitaplığı kullanıyorum, gerçekten iyi çalışıyor. Temel olarak JQueryUI ile aynıdır ancak Bootstrap UI'de.

function bsConfirm(question) { 
    var defer = $.Deferred(); 
    BootstrapDialog.show({ 
     type: BootstrapDialog.TYPE_PRIMARY, 
     title: 'Confirmation', 
     message: question, 
     closeByBackdrop: false, 
     closeByKeyboard: false, 
     draggable: true, 
     buttons: [{ 
      label: 'Yes', 
      action: function (dialog) { 
       defer.resolve(true); 
       dialog.close(); 
      } 
     }, { 
      label: 'No', 
      action: function (dialog) { 
       defer.resolve(false); 
       dialog.close(); 
      } 
     }], 
     close: function (dialog) { 
      dialog.remove(); 
     } 
    }); 
    return defer.promise(); 
} 
function bsAlert(error, message) { 
    BootstrapDialog.show({ 
     type: error ? BootstrapDialog.TYPE_DANGER : BootstrapDialog.TYPE_SUCCESS, 
     title: error ? "Error" : "Success", 
     message: message, 
     closeByBackdrop: false, 
     closeByKeyboard: false, 
     draggable: true, 
     buttons: [{ 
      label: 'OK', 
      action: function (d) { 
       d.close(); 
      } 
     }] 
    }); 
} 

ve kullanmaya Ben this JSFIDDLE oluşturulan ve o havaya uçurmak çünkü boolean parse değişti

bsConfirm("Are you sure Bootstrap is what you wanted?").then(function (a) { 
    if (a) { 
     bsAlert("Well done! You have made the right choice"); 
    } else { 
     bsAlert("I don't like you!"); 
    } 
}); 

Answer 2

(Hemen hemen aynı şekilde). Sağol Pierre! Bu bana çok zaman kazandı.

javascript:

function confirmation(question) { 
var defer = $.Deferred(); 
$('<div></div>') 
    .html(question) 
    .dialog({ 
     autoOpen: true, 
     modal: true, 
     title: 'Confirmation', 
     buttons: { 
      "Yes": function() { 
       defer.resolve("true");//this text 'true' can be anything. But for this usage, it should be true or false. 
       $(this).dialog("close"); 
      }, 
      "No": function() { 
       defer.resolve("false");//this text 'false' can be anything. But for this usage, it should be true or false. 
       $(this).dialog("close"); 
      } 
     }, 
     close: function() { 
      //$(this).remove(); 
      $(this).dialog('destroy').remove() 
     } 
    }); 
return defer.promise(); 
}; 

function onclick(){ 
var question = "Do you want to start a war?"; 
confirmation(question).then(function (answer) { 
    console.log(answer); 
    var ansbool = (String(answer) == "true"); 
    if(ansbool){ 
     alert("this is obviously " + ansbool);//TRUE 
    } else { 
     alert("and then there is " + ansbool);//FALSE 
    } 
}); 
} 

$("#item").on('click', onclick); 

HTML:

<button id="item">Hello, click me.</button> 

Answer 3

neden yöntemi ("false") kararlılığının instaed reddetmek kullanmayın. Daha sonra bir nesneyi argüman olarak geçirebileceksiniz. Diyelim ki girdilerin birden alan kümeleri var diyelim, bir silme düğmesi olan her biri:

function confirmation(question,obj) { 
    var defer = $.Deferred(); 
    $('<div></div>') 
     .html(question) 
     .dialog({ 
      autoOpen: true, 
      modal: true, 
      title: 'Confirmation', 
      buttons: { 
       "Oui": function() { 
        defer.resolve(obj);// pass the object to delete to the defer object 
        $(this).dialog("close"); 
       }, 
       "Non": function() { 
        defer.reject();//reject, no need to pass the object 
        $(this).dialog("close"); 
       } 
      }, 
      close: function() { 

       $(this).dialog('destroy').remove() 
      } 
     }); 
    return defer.promise(); 
} 

$(document).on("click", ".btn-suppr",function(){// all delete buttons having a class btn-suppr 

var question = "Are you sure to delete this fieldset ?"; 
confirmation(question,$(this)).then(function (obj) { 

           obj.parent('fieldset').remove(); // remove the parent fieldset of the delete button if confirmed 

          }); 
         });