2014-10-01 109 views
0

我對SimpleModal確認示例有問題。我想等待結果作爲基本確認對話框,然後根據按下的按鈕採取行動。我在其他js打電話。我的js代碼是:simplemodal確認實例等待返回值

var res = confirm("Delete elements?"); 

if (res == true) { 
     mainController.deleteNode(nodeMoveMessage, url); 
    } 

,以及使對話框中的JS是:

function confirm(message, callback) { 
var modalWindow = document.getElementById("confirm"); 
console.log(modalWindow); 
$(modalWindow).modal({ 
    closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>", 
    position: ["20%",], 
    overlayId: 'confirm-overlay', 
    containerId: 'confirm-container', 
    onShow: function (dialog) { 
     var modal = this; 

     $('.message', dialog.data[0]).append(message); 

     // if the user clicks "yes" 
     $('.yes', dialog.data[0]).click(function() { 
      // close the dialog 
      modal.close(); // or $.modal.close(); 
      // call the callback 
      return true; 
     }); 
    } 
}); 
} 

在我的JSP中的DIV是:

<div id='confirm'> 
     <div class='header'><span>Confirm</span></div> 
     <div class='message'></div> 
     <div class='buttons'> 
      <div class='no simplemodal-close'>No</div><div class='yes'>Yes</div> 
     </div> 
    </div> 

非常感謝!

回答

0

你已經到了一個回調添加到您的模式,所以先在confirm功能添加:

function confirm(message, callback) { 
    var modalWindow = document.getElementById("confirm"); 
    console.log(modalWindow); 
    $(modalWindow).modal({ 
     closeHTML: "<a href='#' title='Close' class='modal-close'>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() { 
       modal.close(); $.modal.close(); 
       callback(); // HERE IS THE CALLBACK 
       return true; 
      }); 
     } 
    }); 
} 

然後你就可以調用confirm功能與執行的回調時按鈕點擊,這樣的:

function doSomething() { 
    mainController.deleteNode(nodeMoveMessage, url); 
} 

confirm("Delete elements?", doSomething); 

現在,當用戶點擊按鈕doSomething功能將被調用,元素將b刪除。