javascript - How to customize close dialog function for ngDialog? -
i have implement customized close dialog function close button of ngdialog
.
as per requirement in cases (where there form) have show ngdialog confirm popup asking if user want close dialog or not there 2 options 'yes' , 'no' has behavior.
i have tried preclosecallback()
method somehow did not worked me does not wait user confirmation. function called on click of close , dialog closed or stays open depending on return function immediately. if don't return assumes true , closes dialog.
can please let me know way solve issue?
here comes nice solutions! it's bit hacky worked case.
step 1
set showclose
option false while opening dialog.
// in controller popupfactory.openmodal('some_name','some_url.html', 'ngdialog-theme-default some_extra_css', $scope, function(value){ console.log("done:", value); },'some_controller',false); // false passes set **showclose** option false // in common factory function openmodal(name, templateurl, classes, scope, callback, ctrl, showclose){ if(showclose === undefined){ showclose = true; } ngdialog.openconfirm({ name: name, controller: ctrl, template: templateurl, classname: classes, closebydocument: false, // prevent popup close clicking outside closebyescape: false, // prevent popup close esc key closebynavigation : true, // close popup on state navigation scope: scope, disableanimation: true, showclose: showclose, preclosecallback: function(value) { return true; } }).then(function (value) { callback(value); }); }
step 2
write common close button handling function
// in common factory /** * customize close open modal form * @param isdirty - flag saying if form dirty * @param $scope - scope object of current open form * @param $event - $event object passed close button of open form */ var closeconfirmopen = false; function closeform(isdirty,$scope,$event){ // following lines important prevent default behavior of ngdialog close event if($event){ $event.preventdefault(); $event.stoppropagation(); } if(isdirty){ var msg = $filter('translate')('navigateawaywithoutsavingconfirmmsg'); closeconfirmopen = true; confirmpopup('warning', msg, null, 'leavepage', 'red', 'stayonpage', function(isok){ if(isok == 1){ $scope.closethisdialog(); } closeconfirmopen = false; }); }else{ $scope.closethisdialog(); } }
step 3
write close function in controller call factory function
/** * close sample location modal */ $scope.closeform = function($event){ popupfactory.closeform($scope.formname.$dirty,$scope,$event); }
step 4
add following line after defining header/title html of ngdialog
<div id="some_id" class="ngdialog-close" ng-click="closeform($event)"></div>
yooo... done job...!!!
the best part of solutions common code closing form, once done factory function, need add close button wherever required in html , add simple close function in controller
Comments
Post a Comment