ion-select popover interface is not getting hidden on hardware back button action
up vote
0
down vote
favorite
I used the popover interface on <ion-select> to display pop-over. In an Android device, if the user taps on ion-select but didn't select any option and click the hardware back button, it moves to the previous view but popover interface is still visible. Please help.
<ion-select interface="popover" [(ngModel)]="item.productType" placeholder="Please select" multiple="false" ionChange="onChange($event)" >
<ion-option *ngFor="let opt of options" [value]="opt.value">opt.label</ion-option>
</ion-select>
ionic-framework ionic3 hybrid-mobile-app
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
asked Nov 12 at 6:29
Abhee
136
add a comment |
up vote
0
down vote
favorite
I used the popover interface on <ion-select> to display pop-over. In an Android device, if the user taps on ion-select but didn't select any option and click the hardware back button, it moves to the previous view but popover interface is still visible. Please help.
<ion-select interface="popover" [(ngModel)]="item.productType" placeholder="Please select" multiple="false" ionChange="onChange($event)" >
<ion-option *ngFor="let opt of options" [value]="opt.value">opt.label</ion-option>
</ion-select>
ionic-framework ionic3 hybrid-mobile-app
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
asked Nov 12 at 6:29
Abhee
136
if user tap on ion-select but didn't select any optionare you sure that there is popping after you click ion-select?
– nyx97
Nov 12 at 7:41
there is a popping after user select any option from pop over but user just tap on ion-select>>pop-over appears>> click android back button>> pop-over is not popping out.Please help
– Abhee
Nov 29 at 15:07
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
I used the popover interface on <ion-select> to display pop-over. In an Android device, if the user taps on ion-select but didn't select any option and click the hardware back button, it moves to the previous view but popover interface is still visible. Please help.
<ion-select interface="popover" [(ngModel)]="item.productType" placeholder="Please select" multiple="false" ionChange="onChange($event)" >
<ion-option *ngFor="let opt of options" [value]="opt.value">opt.label</ion-option>
</ion-select>
ionic-framework ionic3 hybrid-mobile-app
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
asked Nov 12 at 6:29
Abhee
136
I used the popover interface on <ion-select> to display pop-over. In an Android device, if the user taps on ion-select but didn't select any option and click the hardware back button, it moves to the previous view but popover interface is still visible. Please help.
<ion-select interface="popover" [(ngModel)]="item.productType" placeholder="Please select" multiple="false" ionChange="onChange($event)" >
<ion-option *ngFor="let opt of options" [value]="opt.value">opt.label</ion-option>
</ion-select>
ionic-framework ionic3 hybrid-mobile-app
ionic-framework ionic3 hybrid-mobile-app
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
asked Nov 12 at 6:29
Abhee
136
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
asked Nov 12 at 6:29
Abhee
136
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
edited Nov 12 at 7:45
Suraj Rao
22.5k75469
22.5k75469
asked Nov 12 at 6:29
Abhee
136
asked Nov 12 at 6:29
Abhee
136
asked Nov 12 at 6:29
Abhee
136
136
if user tap on ion-select but didn't select any optionare you sure that there is popping after you click ion-select?
– nyx97
Nov 12 at 7:41
there is a popping after user select any option from pop over but user just tap on ion-select>>pop-over appears>> click android back button>> pop-over is not popping out.Please help
– Abhee
Nov 29 at 15:07
add a comment |
if user tap on ion-select but didn't select any optionare you sure that there is popping after you click ion-select?
– nyx97
Nov 12 at 7:41
there is a popping after user select any option from pop over but user just tap on ion-select>>pop-over appears>> click android back button>> pop-over is not popping out.Please help
– Abhee
Nov 29 at 15:07
if user tap on ion-select but didn't select any option are you sure that there is popping after you click ion-select?– nyx97
Nov 12 at 7:41
if user tap on ion-select but didn't select any option are you sure that there is popping after you click ion-select?– nyx97
Nov 12 at 7:41
there is a popping after user select any option from pop over but user just tap on ion-select>>pop-over appears>> click android back button>> pop-over is not popping out.Please help
– Abhee
Nov 29 at 15:07
there is a popping after user select any option from pop over but user just tap on ion-select>>pop-over appears>> click android back button>> pop-over is not popping out.Please help
– Abhee
Nov 29 at 15:07
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
Define page name in modal page.
pageName = "ModalPage";
Then register backbutton in app.component.ts
this.platform.registerBackButtonAction(() =>
let nav = this.app.getActiveNav();
let view = nav.getActive().instance.pageName;
if (view == 'ModalPage')
let activeView: ViewController = nav.getActive();
activeView.dismiss();
else
this.nav.pop();
Basically it will register your device backbutton to perform action when particular modal opened.
Feel free to comment for more help :)
answered Nov 12 at 10:06
Harry
1485
This may work if i create any modalpage but here im using ion-select pop-over. this is not working for ion-select I tried using @ViewChild('myselect') select: Select; and in ionWillLeave I am closing this.select.close(); this is working fine. But I have select field based on some condition , those select fields are not working if use @viewchild and getting error as undefined. Please help
– Abhee
Nov 29 at 15:02
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53256923%2fion-select-popover-interface-is-not-getting-hidden-on-hardware-back-button-actio%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
Define page name in modal page.
pageName = "ModalPage";
Then register backbutton in app.component.ts
this.platform.registerBackButtonAction(() =>
let nav = this.app.getActiveNav();
let view = nav.getActive().instance.pageName;
if (view == 'ModalPage')
let activeView: ViewController = nav.getActive();
activeView.dismiss();
else
this.nav.pop();
Basically it will register your device backbutton to perform action when particular modal opened.
Feel free to comment for more help :)
answered Nov 12 at 10:06
Harry
1485
This may work if i create any modalpage but here im using ion-select pop-over. this is not working for ion-select I tried using @ViewChild('myselect') select: Select; and in ionWillLeave I am closing this.select.close(); this is working fine. But I have select field based on some condition , those select fields are not working if use @viewchild and getting error as undefined. Please help
– Abhee
Nov 29 at 15:02
add a comment |
up vote
0
down vote
Define page name in modal page.
pageName = "ModalPage";
Then register backbutton in app.component.ts
this.platform.registerBackButtonAction(() =>
let nav = this.app.getActiveNav();
let view = nav.getActive().instance.pageName;
if (view == 'ModalPage')
let activeView: ViewController = nav.getActive();
activeView.dismiss();
else
this.nav.pop();
Basically it will register your device backbutton to perform action when particular modal opened.
Feel free to comment for more help :)
answered Nov 12 at 10:06
Harry
1485
This may work if i create any modalpage but here im using ion-select pop-over. this is not working for ion-select I tried using @ViewChild('myselect') select: Select; and in ionWillLeave I am closing this.select.close(); this is working fine. But I have select field based on some condition , those select fields are not working if use @viewchild and getting error as undefined. Please help
– Abhee
Nov 29 at 15:02
add a comment |
up vote
0
down vote
up vote
0
down vote
Define page name in modal page.
pageName = "ModalPage";
Then register backbutton in app.component.ts
this.platform.registerBackButtonAction(() =>
let nav = this.app.getActiveNav();
let view = nav.getActive().instance.pageName;
if (view == 'ModalPage')
let activeView: ViewController = nav.getActive();
activeView.dismiss();
else
this.nav.pop();
Basically it will register your device backbutton to perform action when particular modal opened.
Feel free to comment for more help :)
answered Nov 12 at 10:06
Harry
1485
Define page name in modal page.
pageName = "ModalPage";
Then register backbutton in app.component.ts
this.platform.registerBackButtonAction(() =>
let nav = this.app.getActiveNav();
let view = nav.getActive().instance.pageName;
if (view == 'ModalPage')
let activeView: ViewController = nav.getActive();
activeView.dismiss();
else
this.nav.pop();
Basically it will register your device backbutton to perform action when particular modal opened.
Feel free to comment for more help :)
answered Nov 12 at 10:06
Harry
1485
answered Nov 12 at 10:06
Harry
1485
answered Nov 12 at 10:06
Harry
1485
answered Nov 12 at 10:06
Harry
1485
1485
This may work if i create any modalpage but here im using ion-select pop-over. this is not working for ion-select I tried using @ViewChild('myselect') select: Select; and in ionWillLeave I am closing this.select.close(); this is working fine. But I have select field based on some condition , those select fields are not working if use @viewchild and getting error as undefined. Please help
– Abhee
Nov 29 at 15:02
add a comment |
This may work if i create any modalpage but here im using ion-select pop-over. this is not working for ion-select I tried using @ViewChild('myselect') select: Select; and in ionWillLeave I am closing this.select.close(); this is working fine. But I have select field based on some condition , those select fields are not working if use @viewchild and getting error as undefined. Please help
– Abhee
Nov 29 at 15:02
This may work if i create any modalpage but here im using ion-select pop-over. this is not working for ion-select I tried using @ViewChild('myselect') select: Select; and in ionWillLeave I am closing this.select.close(); this is working fine. But I have select field based on some condition , those select fields are not working if use @viewchild and getting error as undefined. Please help
– Abhee
Nov 29 at 15:02
This may work if i create any modalpage but here im using ion-select pop-over. this is not working for ion-select I tried using @ViewChild('myselect') select: Select; and in ionWillLeave I am closing this.select.close(); this is working fine. But I have select field based on some condition , those select fields are not working if use @viewchild and getting error as undefined. Please help
– Abhee
Nov 29 at 15:02
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53256923%2fion-select-popover-interface-is-not-getting-hidden-on-hardware-back-button-actio%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
if user tap on ion-select but didn't select any optionare you sure that there is popping after you click ion-select?– nyx97
Nov 12 at 7:41
there is a popping after user select any option from pop over but user just tap on ion-select>>pop-over appears>> click android back button>> pop-over is not popping out.Please help
– Abhee
Nov 29 at 15:07