I am trying to override the button click event for autoform-remove-item button as shown below, as I am trying to show a warning message ( before ) the user can remove any item in the Autoform array. Then if the user confirmed the item removal then the button click event shall continue normally. But I can't figure out how to override the click event of the button in a way to pause code below it (which I have no access to) until the user confirm / reject the deletion? Any help what I might be missing here? Thanks
Template.salesInvoice.events({
'click .autoform-remove-item': function(e){
e.preventDefault();
bootbox.dialog({
message: "Are you sure you wish to delete this item?",
title: "New Journal",
buttons: {
eraseRecord: {
label: "Yes!",
className: "btn-danger",
callback: function() {
}
},
doNotEraseRecord: {
label: "No!",
className: "btn-primary",
callback: function() {
//Continue with the normal button click event
}
}
}
});
}
});
The click event I am trying to override:
'click .autoform-remove-item': function autoFormClickRemoveItem(event, template) {
var self = this; // This type of button must be used within an afEachArrayItem block, so we know the context
event.preventDefault();
var name = self.arrayFieldName;
var minCount = self.minCount; // optional, overrides schema
var maxCount = self.maxCount; // optional, overrides schema
var index = self.index;
var data = template.data;
var formId = data && data.id;
var ss = AutoForm.getFormSchema(formId);
// remove the item we clicked
arrayTracker.removeFromFieldAtIndex(formId, name, index, ss, minCount, maxCount);
},
Can't you just show the bootbox confirm in the code where the collection is removed? Then only remove it from the collection when the user confirms it. For example, I think this should help:
'click .autoform-remove-item': function autoFormClickRemoveItem(event, template) {
bootbox.dialog({
message: "Are you sure you wish to delete this item?",
title: "New Journal",
buttons: {
eraseRecord: {
label: "Yes!",
className: "btn-danger",
callback: function() {
var self = this;
var name = self.arrayFieldName;
var minCount = self.minCount; // optional, overrides schema
var maxCount = self.maxCount; // optional, overrides schema
var index = self.index;
var data = template.data;
var formId = data && data.id;
var ss = AutoForm.getFormSchema(formId);
arrayTracker.removeFromFieldAtIndex(formId, name, index, ss, minCount, maxCount);
}
},
doNotEraseRecord: {
label: "No!",
className: "btn-primary",
callback: function() {
//Continue with the normal button click event
}
}
}
});
}
}