保存前按确认按钮

时间:2016-11-30 16:51:09

标签: javascript jquery

我在使用alert保存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;
});

1 个答案:

答案 0 :(得分:0)

我最近使用了noty插件,与jQuery一起推迟解决类似的问题。

首先,显示确认对话框并返回类似承诺的对象的函数,如果按下确定按钮,该对象将解析为true;如果按下取消按钮,则返回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
    }
}