Boa noite amigos…
Vou tentar explicar um problema que estou tendo e que passei o dia inteiro de hoje martelando, googleando e nada de conseguir resolver…
Imaginem que em minha página xhtml tenho o seguinte trecho de codigo:
<h:form id="theForm">
<h:commandButton styleClass="confirm" action="#{meuManagedBean.remove}" title="Excluir" />
</h:form>Eu precisava utilizar um confirm do javascript para solicitar ao usuário a confirmação para a exclusão deste registro.
Desta forma adicionei ao código acima o atributo:
onclick="javascript:if(!(confirm('Deseja excluir ?') { return false; }))"Dai funcionou belezinha… porém… procurando na net encontrei um confirm que fica em modo “modal” utilizando-se de jQuery…
Resolvi coloca-lo e foi ai que minha vida virou um caos…
Ele desenha a modal box atravez da classe confirm do css conforme codigo abaixo:
/*
* SimpleModal Confirm Modal Dialog
* http://www.ericmmartin.com/projects/simplemodal/
* http://code.google.com/p/simplemodal/
*
* Copyright (c) 2010 Eric Martin - http://ericmmartin.com
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Revision: $Id: confirm.css 254 2010-07-23 05:14:44Z emartin24 $
*/
#confirm {display:none;}
/* Overlay */
#confirm-overlay {background-color:#eee; cursor:wait;}
/* Container */
#confirm-container {height:140px; width:420px; font: 16px/22px 'Trebuchet MS', Verdana, Arial; text-align:left; background:#fff; border:2px solid #336699;}
#confirm-container .header {height:30px; line-height:30px; width:100%; background:url(../img/confirm/header.gif) repeat-x; color:#fff; font-weight:bold;}
#confirm-container .header span {padding-left:8px;}
#confirm-container .message {color:#333; font-size:14px; margin:0; padding:12px 4px 12px 8px;}
#confirm-container .buttons {line-height:26px; width:160px; float:right; padding:10px 8px 0;}
#confirm-container .buttons div {float:right; margin-left:4px; width:70px; height:26px; color:#666; font-weight:bold; text-align:center; background:url(../img/confirm/button.gif) repeat-x; border:1px solid #bbb; cursor:pointer;}
#confirm-container a.modal-close,
#confirm-container a.modal-close:link,
#confirm-container a.modal-close:active,
#confirm-container a.modal-close:visited {text-decoration:none; font-weight:bold; position:absolute; right:10px; top:2px; color:#fff;}
#confirm-container a.modal-close:hover {color:#ccc;}E possui o seguinte arquivo javascript vinculado:
jQuery(function ($) {
$('#confirm-dialog input.confirm, #confirm-dialog').click(function (e) {
e.preventDefault();
confirm("Deseja excluir o registro selecionado?", function() {
// aqui
});
});
});
function confirm(message, callback) {
$('#confirm').modal({
closeHTML: "<a >x</a>",
position: ["20%",],
overlayId: 'confirm-overlay',
containerId: 'confirm-container',
onShow: function (dialog) {
var modal = this;
$('.message', dialog.data[0]).append(message);
$('.yes', dialog.data[0]).click(function () {
if ($.isFunction(callback)) {
callback.apply();
}
modal.close();
});
}
});
}Agora o problema… pelo que eu entendi o método e.preventDefault(); abort o submit que é provocado pelo click no meu commandButton na minha página …
Ele exibe o modal box sem problema nenhum… entretanto quando eu clico em “Sim” e ele entra no callback eu não consegui encontrar nada, absolutamente nada, que fizesse com que ou o submit continuasse, ou forçasse um novo submit ou até mesmo chama-se de maneira direta o meu método remove no meu managedBean.
Alguém ai teria alguma sugestão do que eu posso fazer para resolver este problema ?
Ficarei muito grato pela ajuda.
