ngDialog change options while dialog is open

Question

Is it possible to change options of an open dialog?

Specifically, I want to set showClose, closeByEscape and closeByDocument to false.

The reason is that I have a form in the dialog. On clicking Save, I make a request to the server. At the same time, I disable the buttons and also want to make sure that the dialog can’t be closed until there is a response. But I want the user to be able to easily close the dialog before they click Save.

Answer 1

I'm not sure whether you can do this explicitly by simply changing the values of those attributes, as they don't appear to be bound both ways. But there is a preCloseCallback attribute that you can set to prevent closing based on some local variable. So what I would do is, before the request, set some variable indicating the request is in progress. When the request finishes, reset that variable. Then, in the preCloseCallback, check whether that variable is set. Here is a simple example:

  $scope.toggleCloseable = function() {
    $scope.closeable = !$scope.closeable;
  }

  $scope.openDialog = function() {
    ngDialog.open({ 
      template: 'firstDialogId', 
      className: 'ngdialog-theme-default', 
      showClose: true,
      scope: $scope,
      preCloseCallback: function() {
        return $scope.closeable;
      }
    });
  }

Here is a simple plunker where that variable is set by a button press in the modal, but this could just as easily be set before & after a request is made. You'll see that when the closeable flag is false, none of the close actions work, but when it is true, it works as usual.

https://plnkr.co/edit/d4m0tryFdm8vWWgh7a4j