Archive

Archive for October, 2012

jquery colorbox as simple dialog

October 8, 2012 Leave a comment

I’ve been working with opencart for a while now, and like the choice of jquery libraries that have been chosen for the project.  Recently I was developing a custom extension for opencart that required a simple dialog to appear before deleting a record.  Opencart is using the excellent colorbox jquery plugin for lightboxes and I wanted to see if I could leverage the plugin for a simple jquery dialog.

I ended up using the following code:

<a onclick="delete_entry_dialog(<?php echo $entry['id'] ?>)">Remove</a>

<div style="display:none">
 <div id="delete_entry_dialog">
 <p>
    Are you sure you want to delete this entry?
 </p>
 <a id="delete_dialog_continue">Continue</a> or <a onclick="$.colorbox.close()">Cancel</a>
 </div>
</div>

<script type="text/javascript">
function delete_entry_dialog(id) {    
    $.colorbox({inline:true, href:'#delete_entry_dialog'});
    $('#delete_dialog_continue').bind('click', function() {
       delete_entry(id); 
       $.colorbox.close();
    });
}
</script>
Categories: jquery