Async operations in modal callback

Question

I'm using the semantic-ui modal to allow users to insert data. It has an onApprove callback which allows you to return false to keep the modal open if there are any problems. My data is inserted into a DB, which returns false if there's any error. What's the best way of keeping the modal open if there's an error during this async operation?

Here's my code (coffeescript):

$('#verification-modal')
.modal('setting', {
    detachable: false,
    onApprove: validateVerificationForm
    closable: false
})

 validateVerificationForm = () ->
      formData = $('.form').serializeArray()
      formatted = format($formData);

      ID_Details.insert(formatted, (errs, id) ->
         if errs
             false
         else
            true

Obviously the anonymous function is returning true/false into the context of the function. What's the best way to return it to the modal?

You can return false, on success in all conditions then close it using $('.modal').modal('hide') — Joseph

Hubert OG Hubert OG · Accepted Answer · 2014-07-07T07:29:08

You can use a local reactive variable:

var data = new ReactiveDict();

Template.modalTemplate.created = function() {
  data.set('isError', false);
};

Template.modalTemplate.helpers({
  isError: function() {
    return data.get('isError');
  },
});

var yourMethodWithAsync = function() {
  ...
  async(..., function(error) {
    if(error) {
      data.set('isError', true);
    }
    ...
  });
};

Async operations in modal callback

1 Answers