Skip to content

Instantly share code, notes, and snippets.

@behringer24
Created June 19, 2011 09:56
Show Gist options
  • Save behringer24/1034027 to your computer and use it in GitHub Desktop.
Save behringer24/1034027 to your computer and use it in GitHub Desktop.
Flexible confirm dialogs for multiple rows with jQuery UI
<div class='content'>
<h1>Demo</h1>
<div id='testupdate'>AJAX Update</div>
<a href='/ajax/remote' data-update='testupdate' data-dialog='confirm_delete' class='confirm'>Update something</a>
<a id='removetest' href='/ajax/remote2' data-remove='removetest' data-dialog='confirm_delete' class='confirm'>Remove something</a>
</div>
<div id='confirm_delete' title='Delete Confirmation' data-confirm='Ok' data-cancel='Cancel' class='confirm_dialog'>
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>Are you shure?</p>
</div>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('.confirm_dialog').dialog({
modal: true,
bgiframe: true,
autoOpen: false
});
$('.confirm').click( function(e) {
e.preventDefault();
var dialog = $('#' + $(this).attr('data-dialog'));
var url = $(this).attr('href');
var update = $(this).attr('data-update');
var remove = $(this).attr('data-remove');
var buttons = {};
buttons[dialog.attr('data-confirm')] = function() {
dialog.dialog( "close" );
$.ajax({
url: url,
success: function(xml) {
if (update) {
$('#' + update).html(xml);
}
if (remove) {
$('#' + remove).remove();
}
}
});
};
buttons[dialog.attr('data-cancel')] = function() {
dialog.dialog( "close" );
};
dialog.dialog('option', 'buttons', buttons);
dialog.dialog('open');
});
})
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment