- 10.2
- Angular
- .net core
I want to show warning message on TenantSettings page, when user change some of the settings and forgot to save and when he try to redirect any where else then I want to warn user that "There are changes you have made to the page. If you quit, you will lose your changes." something like that.
So for above task I did changes below :
export class AccountRouteGuard implements CanActivate, CanDeactivate<CheckUnsavedComponent> {
constructor(
private _permissionChecker: PermissionCheckerService,
private _router: Router,
private _sessionService: AppSessionService
) { }
canDeactivate(component: CheckUnsavedComponent, currentRoute: ActivatedRouteSnapshot, currentState: RouterStateSnapshot, nextState?: RouterStateSnapshot): boolean | import("@angular/router").UrlTree | import("rxjs").Observable<boolean | import("@angular/router").UrlTree> | Promise<boolean | import("@angular/router").UrlTree> {
if (component.canDeactivate()) {
return confirm('There are changes you have made to the page. If you quit, you will lose your changes.');
} else {
return true;
}
}
added 1 new class
import {Observable} from 'rxjs';
export declare interface CheckUnsavedComponent {
canDeactivate: () => boolean | Observable<boolean>;
}
in tenant-settings.component.ts
canDeactivate() {
if (this.initialTimeZone !== this.settings.general.timezone )
return true;
else
return false;
}
in tenant-settings-routing.module.ts
const routes: Routes = [{
path: '',
component: TenantSettingsComponent,
pathMatch: 'full', canDeactivate: [AccountRouteGuard],
}];
and it works as expected.
But my issue is I want to change the title of the confirm messageBox or I want to use our messageService.confirm to show the warning. I tried to use AspNet zero messageService.confirm there but it seems like works asynchronously. Could you please help me with this issue please.
9 Answer(s)
-
0
Hi @shridhar.mole Can you please check that https://blog.thoughtram.io/angular/2016/07/18/guards-in-angular-2.html
-
0
Hi @musa.demir My only issue is I am not able to change the title of confirm message box, I already put in the description of ticket , functionality is working fine. I only want to use messageService.confirm method to show the wanring message so that I can able to modify title of the confirm message box. Please let me know if you not understand my issue.
-
0
Hi,
Could you try
abp.message.confirm("message","title")? -
0
Hi @ismcagdas , Yes I tried that, this is same method we are using with messageService.Confirm.
we can able to modify title of the confirm messageBox with your solution, but this works like asynchronous. before receiving the response of confirm method , execution of method "canDeactivate" is completes.
Could you please try to implement the same functionality in your demo project so that you can get my issue . Sorry If I am not able to explain my issue with you in good words, but I think you should try to implement the same scenario at your end in demo application and let me know the result.
Please let me know if you have any doubts in ticket description.
-
0
Hi,
Could you try to change
abp.message.confirminangular\src\assets\abp-web-resources\abp.sweet-alert.js?abp.message.confirm = function (message, title, callback, options) { options = options || {}; options.title = title ? title : abp.localization.localize('AreYouSure', 'AbpZeroTemplate'); options.icon = 'warning'; options.confirmButtonText = options.confirmButtonText || abp.localization.localize('Yes', 'AbpZeroTemplate'); options.cancelButtonText = options.cancelButtonText || abp.localization.localize('Cancel', 'AbpZeroTemplate'); options.showCancelButton = true; if (options.isHtml) { options.html = message; } else { options.text = message; } return Swal.fire(options).then(function(result) { return (callback && callback(result.value)); }); }; -
0
No, using abp.message.confirm we can't solve this issue. Please try to do same thing in your demo application and let me know the result.(If you are able to change the title of default message box or not)
-
0
Hi,
What was the problem when you try my suggestion https://support.aspnetzero.com/QA/Questions/10137/Not-able-to-use-MessageServiceconfirm-under-'canDeactivate'-method-of-'AccountRouteGuard'-class#answer-f69e03a3-89a2-a524-2738-39fb22ed03a4 ? It worked for me when I tried it.
Thanks,
-
0
Hi, The only change you had made in "angular\src\assets\abp-web-resources\abp.sweet-alert.js" under "abp.message.confirm" was
return Swal.fire(options).then(function (result) { return (callback && callback(result.value)); // this line you changed only right? });right? I tried that and not solved my issue, same behaviour I seen.
-
0
Hi @shridhar.mole
Yes, that's correct. When I tried it it worked for me. Is it possible to share your project via email with [email protected] ? It will be better to check this problem on code I think.
Thanks,
