Usa callbacks o promesas
Callbacks
Esta es la solución más simple
$("#next-wizard").on("click", function(){
var div_active = $(".active");
if(validate_step(div_active)) {
// En lugar de esperar un retorno pasas una función por parámetros
msg_box_popup("¿cual es tu respuesta?", function(response_msg) {
if(response_msg == true){
//hago algo.
}else{
//hago algo tambien.
}
});
}
});
function msg_box_popup(txt_msg, callback){
var msg_box = $(".msg-box");
msg_box.parent().removeClass("hidden");
msg_box.find(".text-msg .msg").html(txt_msg);
msg_box.find("#btn_accept").on("click",function(){
msg_box.parent().addClass("hidden");
// Ejecutas el callback pasando el valor aceptado (true)
callback(true);
});
msg_box.find("#btn_deneg").on("click",function(){
msg_box.parent().addClass("hidden");
// Ejecutas el callback pasando el valor denegado (false)
callback(false);
});
}
Promesas
Para esto necesitas una librería como Q, bluebird u otra similar. Afortunadamente jQuery trae una implementación bastante simple a la que llaman Deferred Object que te puede servir.
$("#next-wizard").on("click", function(){
var div_active = $(".active");
if(validate_step(div_active)) {
// En lugar de esperar un retorno pasas una función por parámetros
msg_box_popup("¿cual es tu respuesta?").then(function(response_msg) {
if(response_msg == true){
//hago algo.
}else{
//hago algo tambien.
}
});
}
});
function msg_box_popup(txt_msg, callback){
// Creas la promesa
var defer = $.Deferred();
var msg_box = $(".msg-box");
msg_box.parent().removeClass("hidden");
msg_box.find(".text-msg .msg").html(txt_msg);
msg_box.find("#btn_accept").on("click",function(){
msg_box.parent().addClass("hidden");
// Resuelves la promesa con el valor aceptado (true)
defer.resolve(true);
});
msg_box.find("#btn_deneg").on("click",function(){
msg_box.parent().addClass("hidden");
// Resuelves la promesa con el valor denegado (false)
defer.resolve(false);
});
// La devuelves para que puedas agregarle un método then
return defer;
}
Nota: Quizás te veas tentado a usar defer.reject
para señalizar cuando el usuario escogió false pero esto es una mala idea ya que el reject
está diseñado como el canal de error por lo que si ocurre una excepción te puede resultar dificil distinguir si el usuario escogio false
o hay un error en algún lugar. Usar resolve(false)
simplifica el problema.