Question

I am using SimpleModal in jQuery, and I have one confirm dialog. If the result is Yes, I have to call my.php into this dialog. However, I have done the code, and I am still searching for ideas. How can I do it?

$(document).ready(function () {     $('#confirmDialog input.confirm, #confirmDialog a.confirm').click(function (e) {         e.preventDefault();         // Example of calling the confirm function.         // You must use a callback function to perform the 'yes' action.         confirm('Continue', function () {             alert('OK');         });     }); });  function confirm(message, callback) {     $('#confirm').modal({         close:false,         position: ['20%',],         overlayId:'confirmModalOverlay',         containerId:'confirmModalContainer',         onShow: function (dialog) {             dialog.data.find('.message').append(message);              // If the user clicks 'yes'             dialog.data.find('.yes').click(function () {                 $.get('my.php', function(data){                     // Create a modal dialog with the data.                     // Here: How do I write the same window?                 });                  // Call the callback                  // Close the dialog                 $.modal.close();             });         }     }); } 

Here I have the problem of how to write it the same window Confirmdialog from an Ajax result. How can I do it?

Answer 1

I’m not sure that the confirm function best fits your needs, but something like this should work:

function confirm(message, callback) {     $('#confirm').modal({         close:false,         position: ['20%',],         overlayId:'confirmModalOverlay',         containerId:'confirmModalContainer',         onShow: function (dialog) {             dialog.data.find('.message').append(message);              // If the user clicks 'yes'             dialog.data.find('.yes').click(function () {                 $.get('my.php', function (data) {                     /* Sample response:                      *   <div id='title'>my title</div>                      *   <div id='message'>my message</div>                      *                      */                     var resp = $('<div/>').append(data);                     var title = resp.find('#title').html(),                         message = resp.find('#message').html();                      dialog.data.find('.header span').html(title);                     dialog.data.find('.message').html(message);                     dialog.data.find('.buttons .yes').hide();                     dialog.data.find('.buttons .no').html('Close');                      // No need to call the callback or $.modal.close()                 });             });         }     }); }