Set Property Id To A Uibmodal

I would like to know if it is possible to set an Id property to a modal generated through $uibModal so later I can capture the correspondent element by its Id. I successfully manag

Solution 1:

id property may be added by $uibModalStack factory provided by ui-bootstrap:

$ctrl.open = function (size, windowTopClass, id) {
var modalInstance = $uibModal.open({
  ariaLabelledBy: 'modal-title',
  ariaDescribedBy: 'modal-body',
  templateUrl: 'myModalContent.html',
  controller: 'ModalInstanceCtrl',
  controllerAs: '$ctrl',
  size: size,
  windowTopClass: windowTopClass,
  windowTemplateUrl: 'my-window.html',
  resolve: {
    projects: function () {
      return$ctrl.projects;
    }
  }
}).rendered.then(function () {
  $uibModalStack.getTop().value.modalDomEl.attr('id', id);
});

note $uibModalStack.getTop().value.modalDomEl.attr('id', id); line, this way id can be passed from the template:

<button type="button" 
        class="btn btn-default" 
        ng-click="$ctrl.open('lg', 'my-outer-class2', 'myID2')">Open me2!</button>

also please note, that you can use windowTopClass or windowClass properties of the $uibModal.open() function, these classes will also be added to the top modal level, so you can also use them for unique selectors.

plunker with 2 buttons applying 2 different ids and css classes: https://plnkr.co/edit/vMw1XtyNOED8PIDP0hWe?p=preview

Solution 2:

There is no way to add "id" attribute Ui Bootstrap modal popup

But you can manage using variable which initialize the $uibModal, In your case it is var modalInstance

Following is the reference which may help For e.g.

//Model Popup for e.g login Uservar loginUser= $uibModal.open({
  .....
   ....
});

loginUser.result.then(function () {
 //Write your on success 
}, function () {
  //Write your code when model close event
});

//Other Model Popup for register Uservar registerUser= $uibModal.open({
  .....
   ....
});

registerUser.result.then(function () {
 //Write your on success 
}, function () {
  //Write your code when model close event
}); 

Hopefully I have answered your question