Combing jquery dialog & jGrowl
I have a page that confirms an action using jquery dialog and after the action is executed, the code will initiate the closing of the dialog and goes to back to the portal. While my backend will handle the action made, i would like to notify the user using jGrowl's unobtrusive notification to inform them that the action was unsuccessful. However, using the following codes, the jGrowl did not manage to execute and app开发者_运维问答ear after the dialog box closes. (my imports are already done at this stage) Where should i place the code?
$("#pop").click(function(){
$( "#dialog-confirm" ).dialog( "open" );
return false;
});
$( "#dialog-confirm" ).dialog({
autoOpen: false,
resizable: false,
height:200,
modal: true,
buttons: {
"Drop": function() {
//ajax
var checkbox = $("#repost").val();
$( this ).dialog( "close" );
$.jGrowl('ACTION SUCCESSFUL!');
},
Cancel: function() {
$( this ).dialog( "close" );
}
}
});
You can use jGrowl's beforeClose event combined with a timer.
$.jGrowl('ACTION SUCCESSFUL!', {
life: 1000,
beforeClose: function(e,m) {
$( "#dialog-confirm" ).dialog( "close" );
}
});
jGrowl's notification should last 1000 milliseconds and then close the dialog. I haven't tested it but it should work.
UPDATE: I forgot to mention that your DROP event should't close the dialog. It should look something like this:
$("#pop").click(function(){
$( "#dialog-confirm" ).dialog( "open" );
return false;
});
$( "#dialog-confirm" ).dialog({
autoOpen: false,
resizable: false,
height:200,
modal: true,
buttons: {
"Drop": function() {
//ajax
var checkbox = $("#repost").val();
// $( this ).dialog( "close" );
$.jGrowl('ACTION SUCCESSFUL!', {
life: 1000,
beforeClose: function(e,m) {
$( "#dialog-confirm" ).dialog( "close" );
}
});
},
Cancel: function() {
$( this ).dialog( "close" );
}
}
});
精彩评论