HI,
I am building application using Ionic 2, and targeting both android and IOS platforms. There is a login screen which gives a call to a back end web service and retrieves user details and navigates to a Dashboard page. Now for IOS platform I run the application using Xcode ,the applications runs successfully, login page gives a call to back end service, user details are retrieved , but it does not navigate to the dashboard page. I have not idea why it is not working on IOS platform . Can someone tell me what could be the problem.
Thanks in advance
Did you remote debug the problem on the device already? Follow these instructions here to debug the problem in Safari dev tools: https://ionic.zone/debug/remote-debug-your-app#ios Look at the console and network tabs for errors.
If need more help, you will have to post some code so we can at least try to understand what is happening in your app.
1 Like
Hi, Thanks for the link of instructions on debugging, but my problem still persists. Here is my code below
loginUser() {
this.filteredList = this.userList.filter(function (el) {
return el.userName.toLowerCase().indexOf(this.userId.toLowerCase()) > -1;
}.bind(this));
if (this.filteredList.length > 0) {
this.url = "xyz/" + this.filteredList[0].userId;
this.httpSer.performGET(this.url).subscribe(
response => {
if (response.success) {
this.navController.setRoot(DashboardPage);
this.showToast("Welcome " + response.userName);
this.storage.set('userData', {
userName: response.userName,
userId: this.filteredList[0].userId,
adminId: response.adminId,
adminName: response.adminName,
roleId: response.roleId,
roleName: response.roleName,
action: response.action,
adminRoleName:response.adminRoleName
});
}
},
error => console.log('Error:Role access'),
);
} else {
this.showToast("Please check username");
}
}
Now, when I am deploying the application on IOS device, login screen shows up, I enter the username,and when I hit the login button, it does give a call to the back end service, I get a success, toast message is printed from the above code, but it does not redirect to the DashboardPage. The good part is that this whole thing works when app is running on android device.
Thank you once again.
Ok, so everything from the code you posted is working and it shows the “Welcome” Toast, correct?
What is the code that should be executed after that to do the redirect?
Yes, toast message is seen,and as you suggested I even debugged using the safari tools, on the console I am getting correct result from back end service. Basically I think the page I am redirecting is not getting rendered properly. Below is the code of the page I am redirecting to.
export class DashboardPage {
constructor(public navCtrl: NavController, public navParams: NavParams, public modalCtrl:
ModalController, public toastCtrl: ToastController,
public alertCtrl: AlertController, private platform: Platform, private datePipe: DatePipe, private storage:
Storage, private httpSer: HttpCommonService,
public loadingCtrl: LoadingController) {
this.platform = platform;
this.alertCtrl = alertCtrl;
this.rootPage = DashboardPage;
this.storage = storage;
this.platform.registerBackButtonAction(() => {
this.platform.exitApp();
});
this.platform.ready().then(() => {
debugger;
if (this.platform.is('ios')) {
this.storageDirectory = cordova.file.documentsDirectory;
console.log("Dashboard page");
}
else if (this.platform.is('android')) {
this.storageDirectory = cordova.file.externalDataDirectory;
}
else {
return false;
}
});
}
}
Please edit your post and use the </> button above the post input field to format your code or error message or wrap it in ``` (“code fences”) manually. This will make sure your text is readable and if it recognizes the programming language it also automatically adds code syntax highlighting. Thanks.
Yeah, but where is the code that should do the redirecting? After the Toast is shown, you have to do something that says “Ok, now let’s go here”.
Ok, this is login code, here loginUser() method is called on button click, and its redirecting to DashboardPage using Navigation controller’s setRoot method.
export class LoginUserPage {
userId: string = "";
userName: string;
email: string = "";
password: string = "";
url: string;
userList = [];
filteredList = []
constructor(private navController: NavController, platform: Platform, public toastCtrl: ToastController, public storage: Storage,private httpSer: HttpCommonService,public viewCtrl: ViewController) {
}
loginUser() {
this.filteredList = this.userList.filter(function (el) {
return el.userName.toLowerCase().indexOf(this.userId.toLowerCase()) > -1;
}.bind(this));
if (this.filteredList.length > 0) {
this.url = "xyz/" + this.filteredList[0].userId;
this.httpSer.performGET(this.url).subscribe(
response => {
if (response.success) {
this.navController.setRoot(DashboardPage);
this.showToast("Welcome " + response.userName);
this.storage.set('userData', {
userName: response.userName,
userId: this.filteredList[0].userId,
adminId: response.adminId,
adminName: response.adminName,
roleId: response.roleId,
roleName: response.roleName,
action: response.action,
adminRoleName:response.adminRoleName
});
}
},
error => console.log('Error:Role access'),
);
} else {
this.showToast("Please check username");
}
}
}
And this is the DashboardPage I am redirecting to.
declare var cordova: any;
declare var window: any;
@Component({
selector: 'page-dashboard',
templateUrl: 'dashboard.html',
providers: [DatePipe]
})
export class DashboardPage {
constructor(public navCtrl: NavController, public navParams: NavParams, public modalCtrl: ModalController, public toastCtrl: ToastController,
public alertCtrl: AlertController, private platform: Platform, private datePipe: DatePipe, private storage: Storage, private httpSer: HttpCommonService,
public loadingCtrl: LoadingController) {
this.platform = platform;
this.alertCtrl = alertCtrl;
this.rootPage = DashboardPage;
this.storage = storage;
this.platform.registerBackButtonAction(() => {
this.platform.exitApp();
});
this.platform.ready().then(() => {
debugger;
if (this.platform.is('ios')) {
this.storageDirectory = cordova.file.documentsDirectory;
console.log("Dashboard page");
}
else if (this.platform.is('android')) {
this.storageDirectory = cordova.file.externalDataDirectory;
}
else {
return false;
}
});
}
}
Ah, I didn’t see this line before - sorry.
(Hope someone else can answer if this should work or how it should be done - I have no experience with this)
No problem, Thank you for your time
Hi,
The previous issue about redirection is solved on iOS device, but now new problem for local storage has arise. Well the local storage is working on android device , but I am not able to get local data on iOS device. Below is code
this.storage.set('userData', {
userName: response.userName,
userId: this.filteredList[0].userId,
adminId: response.adminId,
adminName: response.adminName,
roleId: response.roleId,
roleName: response.roleName,
action: response.action,
adminRoleName:response.adminRoleName
});
and in the second page
getLocalData() {
this.storage.get('userData').then((data) => {
this.userId = data.userId;
this.roleName = data.roleName;
this.action = data.action;
console.log("userId ", this.userId);
})
}
I would advice you create a new topic for this new problem.