保存之前按確認按鈕

Question

我遇到問題，我用ajax保存信息的方式與警報，我使用JQuery確認，但按鈕文本無法更改我決定做我自己的對話框所以我可以修改這些按鈕，但問題是我點擊保存按鈕之前的數據保存。

function saveEdit(e) { 
    var result = ''; 
    var item = $('input[name=username]').val(); 
    $.ajax({ 
    url: root + 'ccards/getAllDetails', 
    data: { 
     item: item 
    }, 
    type: 'POST', 
    async: false, 
    dataType: 'json', 
    success: function(data) { 

     var dateObj = new Date(); 
     var month = dateObj.getUTCMonth() + 1; 
     var day = dateObj.getUTCDate(); 
     var year = dateObj.getUTCFullYear(); 
     var hour = dateObj.getUTCHours() 
     var minute = dateObj.getUTCMinutes(); 
     var second = dateObj.getUTCSeconds(); 

     var datetoday = year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + second; 

     var selected_date = Date.parse(data.modified); 
     var today = Date.parse(datetoday); 

     var d = new Date(data.modified); 
     var h = d.getHours(); 
     var m = d.getMinutes(); 

     var username = data.username.toUpperCase(); 
     var coreuser = data.core_user.username.toUpperCase(); 
     var hr = ''; 
     var time = ''; 

     if (h <= '12') { 
     hr = h; 
     time = hr + ":" + m + " AM"; 
     } else { 
     hr = h - 12; 
     time = hr + ":" + m + " PM"; 
     } 

     if (Math.abs(today - selected_date) <= 60 * 60 * 24 * 1000) { 

     $('#confirmSave').show().dialog({ 
      height: 200, 
      width: 500, 
      zIndex: 10, 
      modal: true, 
      resizable: false 
     }); 

     $('#time').html(time); 
     $('#coreuser').html(coreuser); 

     if ($('#confirmSave button[name=submit]').data('clicked')) { 
      result = true; 


     } else if ($('#confirmSave button[name=cancel]').data('clicked')) { 
      result = false; 
     } 
     } 
    } 
    }); 

    return result; 
} 

$('.clientForm').submit(function(event) { 

    var form = this; 
    console.log(form); 
    if ($("input[name='action']", form).val() == 'save' || $("input[name='action']", form).val() == 'savenew' || $("input[name='action']", form).val() == 'login') { 
    if ((!validate_email(form)) || (!validate(form))) { 
     mode = 'edit'; 
     setMode(mode); 
     return false; 
    } 
    } 

    var save = saveEdit(); 
    if (save == true) { 

    var dt = $(this).serializeArray(); 

    var action = root + $("input[name='module']", form).val() + $("input[name='method']", form).val(); 
    $('.fields', this).slideUp('fast'); 
    $('.response', this).html("<div class='load'>Processing, please wait...</div>"); 
    $.ajax({ 
     type: 'POST', 
     url: action, 
     data: dt, 
     dataType: 'json', 
     success: function(data) { 
     if (data) procJSON.init(data, form); 

     }, 
     complete: function(data) { 

     }, 
     error: function(data) { 
     onError(data); 
     } 
    }); 
    } 
    return false; 
}); 

Answer 1

我最近使用了noty插件，以及jQuery的推遲來解決類似的問題。

首先，顯示確認對話框並返回類似promise的對象的函數，如果按下Ok按鈕則返回true;如果按下Cancel按鈕，則返回false。

function showConfirm(msg) { 
    var dfd = $.Deferred(); 
    noty({ 
     text: msg, 
     type: 'confirm', 
     dismissQueue: false, 
     layout: 'center', 
     theme: 'defaultTheme', 
     modal: true, 
     buttons: 
     [{ 
      addClass: 'btn btn-primary', 
      text: 'Ok', 
      onClick: $noty => { 
       $noty.close(); 
       dfd.resolve(true); 
      } 
     }, 
     { 
      addClass: 'btn btn-danger', 
      text: 'Cancel', 
      onClick: $noty => { 
       $noty.close(); 
       dfd.resolve(false); 
      } 
     }] 
    });  
return dfd.promise(); 
} 

然後，你可以這樣做......

$('.clientForm').submit(function(event) { 
    showConfirm("Do you wish to save?").then(function(confirmed) { 
     if (!confirmed) { 
      return; 
     } 
     // make ajax request here 
    } 
}