[RESOLVIDO] Sobrescrever metodo confirm com YUI

19 de fevereiro de 2011 3 respostas

Master.Abs 19 de fevereiro de 2011

Hi!

Estou criando uma mascara para o confirm do JS.

A mascara está legal, porém meu problema é com a função de retorno do botão ok.
Quando eu clico nela não faz o que tem que fazer.
Possuo em minha aplicação muitos alertas de confirm que se retornam true enviam para
determinado local ou href. Mas com a mascara isso não acontece.

Gostaria da ajuda de todos que possam me auxiliar.

window.confirm = function(msg) {
	var handleOK = function() {    
       //Encontrar uma maneira de chamar um callback ou retornar true de maneira que a mascara entenda o processo.
//OBS: nessa campo já coloquei return true e não funciona.
    };
    
    var handleCancel = function() {
    	this.hide();
    };
    
    var header = '<div align="left"><strong>Alert</strong></div>';
    
	var footer = '<input type="button" id="btnOk" value="Ok" class="btn">'
				+'<input type="button" id="btnCancel" value="Cancela" class="btn">';
	
	maskConfirm.setHeader(header);
	maskConfirm.setBody('<h2>' + msg);
	maskConfirm.setFooter(footer);
	maskConfirm.render(document.body);
	maskConfirm.show();
 
	YAHOO.util.Event.addListener("btnOk", "click", handleOK, maskConfirm, true);
    YAHOO.util.Event.addListener("btnCancel", "click", handleCancel, maskConfirm, true);
};

YAHOO.util.Event.on(window, 'load', function() {
	
	maskConfirm = new YAHOO.widget.SimpleDialog('mask_confirm', {
								        visible:false,
								        width: '300px',
								        zIndex: 9999,
								        close: true,
								        fixedcenter: true,
								        modal: true,
								        draggable: true,
								        constraintoviewport: true,
								    	});
	maskConfirm.render(document.body);
});

3 Respostas

rodrigo_web 19 de fev. de 2011

A função confirm nativa fica aguardando o usuário clicar no ok ou cancelar…
acredito não ter uma forma de reproduzir este comportamento…

tente passar handleOK como parametro…

window.confirm = function(msg, handleOk) { ... ... YAHOO.util.Event.addListener("btnOk", "click", function(){ handleOK(); handleCancel(); }, maskConfirm, true); }
dai você usa o confirm passando a funcao

Master.Abs 21 de fev. de 2011

Valeu cara foi de grande ajuda as informações que me passou.
Segue abaixo como solucionei.

window.confirm = function(msg, handleFunction) {
	
    var handleCancel = function() {
    	this.hide();
    };
    
    var header = '<div align="left"><strong>Alert</strong></div>';
    
	var footer = '<input type="button" id="btnOk" value="Ok" class="btn">'
				+'<input type="button" id="btnCancel" value="Cancela" class="btn">';
	
	maskConfirm.setHeader(header);
	maskConfirm.setBody('<h2>' + msg);
	maskConfirm.setFooter(footer);
	maskConfirm.render(document.body);
	maskConfirm.show();
 
        //Criei uma chamada .call para executar o handleFunction no click do btnOK,
       //dessa forma a chamada é feita e executada com sucesso!
YAHOO.util.Event.addListener("btnOk", "click", function(){handleFunction.call();this.hide();}, maskConfirm, true);
    YAHOO.util.Event.addListener("btnCancel", "click", handleCancel, maskConfirm, true);
};

YAHOO.util.Event.on(window, 'load', function() {
	
	maskConfirm = new YAHOO.widget.SimpleDialog('mask_confirm', {
								        visible:false,
								        width: '300px',
								        zIndex: 9999,
								        close: true,
								        fixedcenter: true,
								        modal: true,
								        draggable: true,
								        constraintoviewport: true
								    	});
	maskConfirm.render(document.body);
});

Javascript

confirm('Deseja Salvar ?', function(){ form.submit() });

Valeu mesmo.

Master.Abs 1 de mar. de 2011

Postando uma solução para adicionar mascara com YUI ao alert e confirm do JS.
com isso todas as telas ficam padronizadas com o layout da aplicação.

/**
 * MASCARA DO METODO ALERT DO JAVASCRIPT.
 */
window.alert = function(text) {
	
	var handleOK = function() {
        this.hide();
    };
    
       var maskAlert = new YAHOO.widget.SimpleDialog('mask_alert', {
								        visible: false,
								        width: 'auto',
								        close: false,
								        fixedcenter: true,
								        modal: true,
								        draggable: false,
								        constraintoviewport: true 
								    });
    
        var header = '<div align="left"><strong>Override Alert</strong></div>';
	var footer = '<input type="button" id="btnOk" value="Ok" class="btn">';
	var h2 = '<h2 align="left" style="padding: 2px 0px 0px 5px;">';

	var str = text;
	//Pula linha dos campos required de cada alerta.
	while(str.indexOf("\n") > -1){
		str=str.replace("\n", "<br>");
	}
	
	maskAlert.setHeader(header);
	maskAlert.setBody(h2 + str);	
	maskAlert.setFooter(footer);
	maskAlert.render(document.body);
        maskAlert.show();

        //Evento do click do botão para fechar o alert
        YAHOO.util.Event.addListener("btnOk", "click", handleOK, maskAlert, true);
        YAHOO.util.Event.on(window, 'load', function() {});
};

/**
 * MASCARA DO METODO CONFIRM DO JAVASCRIPT.
 */
window.confirm = function(msg, handleFunction) {
	
	maskConfirm = new YAHOO.widget.SimpleDialog('mask_confirm', {
								        visible:false,
								        width: '300px',
								        zIndex: 9999,
								        close: false,
								        fixedcenter: true,
								        modal: true,
								        draggable: false,
								        constraintoviewport: true
								    	});
	//variavel para ao clicar no ok fazer a chamada correspondente ao atributo handleFunction.
	var handleOk = function(){
			handleFunction.call();
			this.hide();
	};
	
	var handleCancel = function() {
	  	this.hide();
	};
  
	var header = '<div align="left"><strong>Override Confirm</strong></div>';
  
	var footer = '<input type="button" id="btnOk" value="Ok" class="btn">'
		        +'<input type="button" id="btnCancel" value="Cancela" class="btn">';
	
	maskConfirm.setHeader(header);
	maskConfirm.setBody('<h2>' + msg);
	maskConfirm.setFooter(footer);
	maskConfirm.render(document.body);
	maskConfirm.show();

        //Evento do botão ok e cancelar
	YAHOO.util.Event.addListener("btnOk", "click", handleOk , maskConfirm, true);
	YAHOO.util.Event.addListener("btnCancel", "click", handleCancel, maskConfirm, true);
	YAHOO.util.Event.on(window.confirm, 'load', function() {});
	
};

Criado 19 de fevereiro de 2011

Ultima resposta 1 de mar. de 2011

Respostas 3

Participantes 2

3 Respostas

Topicos relacionados