如何在jquery中处理inpage确认/删除

时间:2016-02-25 22:22:04

标签: jquery backbone.js confirmation

我要求在删除标签之前创建页面确认。我基本上想要使用一个div来显示点击标签的时间,如果有人点击div之外或点击“否”,一切都会重置,如果他们点击“是”,则项目会删除,对话框会隐藏。

这是点击标签时调用的代码

removeGroup: function( evt ) {

  var groupList = this.$el.find('.js-group-list');
  var groupTags = groupList.find('.tag');
  var clickedTag = $(evt.currentTarget).closest('.tag');
  var index = groupTags.index(clickedTag);
  var groupSections = $('.js-favorite-group');
  // add one to account for "All" section
  var groupToRemove = groupSections.eq(index + 1);
  var removedGroupName = this.getGroupNameForSection(groupToRemove);
  var all = groupSections.eq(0);
  var allContainer = allDoctors.find('.js-favorite-row-container');
  clickedTag.addClass('is-active');
  $('.delete-acct-message').show().focus();

  var confirmed = this.removeGroupConfirm( evt );
  if ( confirmed ){
    groupToRemove.find('.js-favorite-row').appendTo(allDoctorsContainer);
    clickedTag.remove();
    groupToRemove.remove();
    this.updateSectionDropdowns();
    this.ariaAlert('Group ' + removedGroupName + ' removed');
    this.hideConfirm(evt);
  }
}

这是确认框的功能

removeGroupConfirm: function(evt){ 
  $('.js-remove-yes').on('click', function(evt){
    evt.preventDefault();
    return true;  
  });
  $('.js-remove-no').on('click', function(evt){
    evt.preventDefault();
    this.hideConfirm(evt);
    return false;  
  });
  var container = $('.delete-acct-message');

  if ( container.is( ':visible' ) ) {
    if (!container.is(evt.target) && container.has(evt.target).length === 0) {
      //this.hideConfirm(evt);
      return false;
    }
  }
}

为了中断删除过程并等待并返回真或假,最好的结构方法是什么?帮助我直接找到我出错的地方。我似乎无法绕过这个。感谢。

1 个答案:

答案 0 :(得分:0)

在搜索之后看起来我需要实现的是使用div作为确认对话框的回调。

removeGroup: function( evt ) {
  var callback = function () {
    groupToRemove.find('.js-favorite-doctor-row').appendTo(allContainer);
    clickedTag.remove();
    groupToRemove.remove();
    that.updateSectionDropdowns();
    that.ariaAlert('Group ' + removedGroupName + ' removed');
    that.hideConfirm(evt);
  }
  this.showAlert(evt, callback);
  var groupList = this.$el.find('.js-group-list');
  var groupTags = groupList.find('.tag');
  var clickedTag = $(evt.currentTarget).closest('.tag');
  var index = groupTags.index(clickedTag);
  var groupSections = $('.js-favorite-group');
  // add one to account for "All Doctors" section
  var groupToRemove = groupSections.eq(index + 1);
  var removedGroupName = this.getGroupNameForSection(groupToRemove);
  var all = groupSections.eq(0);
  var allContainer = all.find('.js-favorite-row-container');
  clickedTag.addClass('is-active');



},

showAlert: function (evt, callback) {
  that = this;
  $('.delete-acct-message').show().focus();
  $('.js-remove-yes').on('click', function(evt){
    evt.preventDefault();
    callback(); 
  });
  $('.js-remove-no').on('click', function(evt){
    evt.preventDefault();
    this.hideConfirm(evt);
  });
},


removeGroupConfirm: function(evt){ 
  that = this;
  that.showAlert(evt, that, callback);
},